Analytics: How to?


#1

I’m trying to get a sense as to what people are doing for analytics within their Ember applications. I understand this is somewhat of a nebulous question and is somewhat domain specific – the intention is to get a high level view.


#2

Are you talking about something like Google Analytics or Piwik?

If yes, this is a great blog post to get it started: http://www.pansapien.com/2013/01/27/using-google-analytics-with-ember-js/


#3

@stravid, although the post you linked is really useful I just found out that this solution is “not working” when you’re transitioning between dynamic segments in the same route

i.e from /posts/1 to /posts/2

I’ve put together a demo in this fiddle http://jsfiddle.net/DCrHG/70/

basically if you look at the console the “currentPage” is not going to be logged when you transition from the first to the second post

My current solution to log all the transitions properly is to reopen Ember.Router and override the didTransition method

Em.Router.reopen({
	didTransition: function(infos){
		this._super(infos);
		Em.run.next(function(){
			path = window.location.pathname;
			// Google analytics code...
		});
	}
})

I don’t love the idea of using a private API to achieve this so if you have better suggestions please let me know !


#4

There’s also a ‘url’ property on the router that could be used:

router.addObserver('url', function() {
        var lastUrl = undefined;
        return function() {
            Ember.run.next(function() {
                var url = router.get('url');
                if (url !== lastUrl) {
                    lastUrl = url;
                    console.log("Google Analytics: " + url);
                }
            });
        };
    }());

Here’s an updated fiddle using this method: http://jsfiddle.net/DCrHG/71/


#5

Alex DiLiberto gave a really nice talk about a robust & scalable way of adding Google Analytics to an ember app in his EmberConf 2014 talk here.

  • slides

    App.ApplicationRoute = Ember.Route.extend({ actions: { didTransition: function() { Ember.run.once(this, function() { ga(‘send’, ‘pageview’, this.router.get(‘url’)); }); } } });

The talk was aiming to be independent of which analytics library was used.


#6

@stravid, your blog link is broken it seems my friend. :sleepy:


#7

Thanks for the reply, I seems that the author changed the URL schema without adding redirects :frowning: New link: https://pansapien.com/2013/01/using-google-analytics-with-ember-js/


#8

As it doesn’t seem to be mentioned in this thread it’s worth noting that there is an official Ember.js cookbook for Google Analytics: http://emberjs.com/guides/cookbook/helpers_and_components/adding_google_analytics_tracking/


#9

There is also an ember-cli addon available for Google Analytics: https://www.npmjs.com/package/ember-cli-google-analytics

Would be nice to have another one adding Piwik support.


#10

Hi,

found a great Ember Addon: https://github.com/poteto/ember-metrics