Adding New Relic Browser to Jekyll
About New Relic Browser
If you’re doing static web hosting, you can use things tools like New Relic Browser to both track users and measure their experiences. With an upgraded subscription, you can monitor for javascript errors, ajax performance, and session traces. It can be very tricky to monitor and troubleshoot these kinds of issues that your user report, so this can be a useful tool for your team to not only monitor traffic, but also performance.
Disclaimer on the next paragraph: I haven’t done a full statistical analysis to figure out why not all traffic is reported back to New Relic.
From using New Relic Browser for a while, I can tell you that you’re not going to get all of your traffic to report back to New Relic, so you will see gaps in your logs. I know some gaps are due to things like bots that aren’t processing the Javascript, hits to the sitemap from search engines, and I think some of the ad and javascript blockers have also picked off some of the traffic.
Setting up New Relic Browser with Jekyll
I built jekyll-newrelic to help ease the setup of New Relic Browser with Jekyll. You get a pretty huge blob of code to put into your site. Even though this is a copy-paste exercise, the gem makes it even easier to setup.
Step 1: Setup your site in New Relic
If you don’t have a New Relic account, sign up for one, and then follow the steps here to configure your site in New Relic.
Once complete, follow these instructions to extract your licenseKey
and applicationID
values. Save these, we’ll need them in step 3.
Step 2: Install jekyll-newrelic
Add jekyll-newrelic
to your Gemfile. I have a group in my Gemfile for all Jekyll plugins that looks like this:
group :jekyll_plugins do
gem 'jekyll-newrelic'
end
Once you’ve updated your Gemfile, run bundle
to install it and any other required dependencies.
$ bundle
Fetching gem metadata from https://rubygems.org/
Fetching version metadata from https://rubygems.org/
Fetching dependency metadata from https://rubygems.org/
...
Installing jekyll-newrelic 0.1.2
...
Step 3: Edit your site configuration
Add jekyll-newrelic
to your _config.yml
file in the gems
section. By default, Jekyll doesn’t have a gems section in the configuration, so if you don’t see it, add it like this:
gems:
- jekyll-newrelic
Next, add the configuration for New Relic using the licenseKey
and applicationID
retrieved in step 1. For example:
newrelic:
licenseKey: "abcdef1234" # Use the actual licenseKey
applicationID: "12345678" # Use the actual applicationID
Step 4: Setup where New Relic code is placed
You have a few choices on how to do this. The way I do this is by editing _includes/head.html
and adding the following before the </head>
line:
{% include newrelic.html %}
Then create a file called _includes/newrelic.html
and add the following:
{% newrelic %}
Optionally, you can do other fun stuff to this. In my case, I only want this block put into place when it’s being built and shipped to the production environment, so I add a conditional:
{% if jekyll.environment == "production" %}{% newrelic %}{% endif %}
The reason to only include the New Relic code in production is to make sure you’re not skewing your own numbers while doing development work on your own site.
Step 5: Ship!
Now that everything is in place, build your site and ship it! Once your site starts getting traffic, you should begin seeing entries in your New Relic dashboards within a few minutes.