When analyzing website performance it's often desirable to analyze a specific type of page. The way to do this in LUX is with page labels. All of the LUX dashboards let you drilldown to specific pages using the Page Label select list:

By default, LUX uses the page's title (document.title) as the page label. This works pretty well for many websites, but for others it can be too specific. For example, a media site might want to analyze "article" pages, but each article has a different title. 

In order to create better page categories, you can use the LUX.label API to specify the page's label:

LUX = window.LUX || {};
LUX.label = "article";

This is a great solution. It gives you the flexibility to create whatever page labels you want. One downside is that you have to add LUX.label to every page. Some teams have already labelled their pages in some other way using JavaScript. If this is your situation, an easy way for you to get your existing page labels into LUX is the Page Label JS setting. You can access this setting by clicking "Edit LUX" on your Settings page: 

A few notes: 

  • If a page has both LUX.label and the page label JS variable, then LUX.label takes precedence.
  • For security reasons, the page label JS can not call functions. Arrays and properties are supported.
  • If the page label JS variable is not defined on a specific page, LUX will still check for it and then fallback to using the page title.
  • Changes to your page label JS setting are pushed live within 15 minutes. However, it can take days to rollout to 100% of users (because it requires them to download a new version of lux.js). For testing purposes, if you'd like to see your changes sooner simply clear lux.js from your cache.


Did this answer your question?