Google Analytics recipe typo? about turbolinks-compatibility

[jonwolfe]

After implementing Google Analytics support in my own app, I believe the strategy mentioned here is superior: https://coderwall.com/p/ypzfdw

If you simply put the standard google analytics script in the document head (NOT the body tag, as you currently recommend), you will get two pageviews recorded on a non-turbolinks page load: one pageview is recorded by the standard Google Analytics script, and another is recorded by the page:change event handler, which is called on that initial page load.

The best approach is this:

1. Put a modified version of the google analytics initialization code in your document head -- modify it to not actually track the pageview.

2. In your document body, put this script tag: <script>_gaq.push(['_trackPageview']);</script>

3. Since the script tag in the body won't be executed when a page is reloaded from the turbolinks cache, add a page:restore handler:

$(document).on 'page:restore', ->
if window._gaq?
_gaq.push ['_trackPageview']
else if window.pageTracker?
pageTracker._trackPageview()

[reed]

I actually didn't come up with the GA solution that's posted. @shukydvir did, and it appears that since then he has put together a gem for it. Take a look at the code and let me know if it works.

shukydvir/google-analytics-turbolinks

[jonwolfe]

Hi Nick. That gem works for tracking pageviews on turbolinks pages, but
with a couple of problems:

1. You need to initialize Google Analytics in the document head -- the gem
   doesn't include that. If you use the standard Google Analytics
   initialization code, you'll get two pageviews on the first page loaded --
   one from the Google Analytics code, and one from the page:change callback
   in the gem.

2. If you modify the Google Analytics initialization code to not record a
   pageview, then pageviews will only be recorded on turbolinks-capable
   browsers. This is a problem for people like me who are using Turbolinks but
   need it to gracefully degrade on older browsers like IE8/9.

Would you like me to submit a pull request for that page that explains the
alternative approach I used, and also the tradeoffs of using that gem? I'd
be happy to do it.

Regardless, the first line on the page is wrong -- you want to move your
javascript from the body to the head with Turbolinks, not the other way
around.

Best,
Jon

On Tue, Dec 3, 2013 at 9:35 PM, Nick Reed [email protected] wrote:

I actually didn't come up with the GA solution that's posted. @shukydvirhttps://github.com/shukydvirdid, and it appears that since then he has put together a gem for it. Take
a look at the code and let me know if it works.

shukydvir/google-analytics-turbolinkshttps://github.com/shukydvir/google-analytics-turbolinks/blob/master/lib/assets/javascripts/google-analytics-turbolinks.js.coffee

—
Reply to this email directly or view it on GitHubhttps://github.com//issues/19#issuecomment-29780872
.

[reed]

If you use Turbolinks 2.0.0, which we just released today, page:change will fire on DOMContentLoaded, so it will gracefully degrade on unsupported browsers. So the correct solution could be:

1. Put a modified version of the google analytics initialization code in your document head -- modify it to not actually track the pageview.
2. Add this snippet inside the head:

trackPageView = ->
  if window.ga?
    ga 'set', 'location', document.location.href.split('#')[0]
    ga 'send', 'pageview'
  else if window._gaq?
    _gaq.push ['_trackPageview']
  else if window.pageTracker?
    pageTracker._trackPageview()

# For Turbolinks 2.0.0
$(document).on 'page:change', trackPageView

# For Turbolinks < 2.0.0
$ ->
  trackPageView()
  $(document).on 'page:change', trackPageView

How does that look? If you agree and would like to submit a PR for it, be my guest.

[jonwolfe]

This is the full solution I came up with. https://gist.github.com/jonwolfe/7897610

The key thing was to test if Turbolinks is initialized and supported before installing the page:change callback. If TL is not supported or is undefined, just track the pageview immediately.

[reed]

Cool. Are you still wanting to submit a pull request to update the site with your solution?