Sitespeed.io: In Grafana, give alias to URLs

[jpvincent]

Hi
On the dashboard, it would be nice to be able to give an alias to the URLs.
For example here :

As you can see the full page name (SEO-friendly and all) is taking lot of space.

I am using an urls.txt, maybe it would be the right place to setup aliases names, for example right after the URL ?
Eg:

http://www.lexpress.fr/ Homepage
http://www.lexpress.fr/actualite/sport/paris-2024-ce-qui-nous-attend-avant-la-decision-finale-en-septembre-2017_1850668.html Article_Page

[soulgalore]

I think that could be a soludtion, I was hoping maybe Grafana had a feature to not display the full length but couldn't find anything.

[jessejacob]

+1 We did some surgery on the dashboard definition file (export to json and reimport) to get this behavior. We would LOVE if it this wasn't necessary because it requires constant maintenance but hugely improves the value of the UI to non-developers (and even some developers).

[soulgalore]

yep I agree, but I wonder if it could be something that could/should be available in Grafana. Else we should add it.

[soulgalore]

pinging @tobli and @beenanner.

[beenanner]

Hmm if it can be done by exporting, modifying, and then re-importing from within Grafan it sounds like a task for Grafana imho. @jessejacob did you ask over on the Grafana project to see if they have any ideas on this issue?

[soulgalore]

I mean, adding a friendly name would be cool, in Grafana it would be something like do a regex to cut out data?

[beenanner]

Also I'm wondering if the method @jessejacob mentioned works with templated variable names on Grafana dashboards. If we did it on the sitespeed.io side it would be sending the alias as the key to the TSDB and you would lose the URL text reference, but it would allow the names to work with templating on Grafana.

[beenanner]

@soulgalore true though for home pages the URL is just "_".

[jessejacob]

I didn't ask, we just assumed it wasn't easy because there's no native UI support for it in Grafana and we did the hand-editing ourselves. I'm not at all aware of the innards of how data is communicated between sitespeed and graphite to even understand what to ask for from grafana in terms of aliasing. Seeing the comments that popped up before I finished typing this, I can see there is concern that the original URL reference disappears. It definitely does. We have some standard concepts on our end that make up for this though; we've put a link on our dashboard to the Jenkins matrix job that kicks off sitespeed runs, so they can always click that to see the original HTML report from sitespeed and tell what actual URLs the aliases represent. I should have my coworker who figured out the hand-edit process get on here and post something about how he did it.

[jessejacob]

@beenanner: related to the home page url being just "_", we were unable to alias that properly via JSON and had to add a hack on the sitespeed side; we add ?1 to the end of home page URLs so we can alias _1 to the word "Home" in the UI. This is one of several reasons it would be cool if sitespeed just handled aliasing natively, but I get that this is hard :)

[soulgalore]

I think the original URL in Grafana is ok to miss if we add an alias on our side.

[jessejacob]

@offbynone: if there is anything you want to add about Grafana aliasing gotchas, let-r-rip.

[OffByNone]

There are two things we used to display it in a friendlier way:

1. Template variables in Grafana have two backing fields in the json - text, value. The only way to change them independently is to export the json, edit it by hand, then reimport. This means they cannot be generated from a query but have to be hard coded instead. Which of course means if you want to add a new value you need to export, fiddle, import.
   a. There are a number of similar issues to make this easier in Grafana such as:
   https://github.com/grafana/grafana/issues/1032
   https://github.com/grafana/grafana/issues/1153
   https://github.com/grafana/grafana/issues/1988
2. You can also use regex's on the query values for the templates, we used this in conjunction with a hidden variable (set "hide" to variable). The visible one has a regex to cut off unfriendly text. And in our case is enough to build the full path from for the hidden variable. So what is shown at the top is user friendly but what is used in the graphs is actually the hidden variable (which is built off the friendlier one).

I personally wouldn’t mind that the whole url isn't shown on the dashboards as long as the sitespeed report has the actual value.

[jpvincent]

Missing the original URL is not very important.
The use case I have, apart from shortening texts in the grafana UI, is also to maintain URLs lists over the time.
I already track performance for some customers since 5 years, and noticed that in e-commerce or newspaper business, from time to time the product or article can simply disappear, or the URL changes because of SEO rules. One has to change the tested URLs, so having an alias would allow to keep the webperf history through time.

In other OS solutions like WPT Monitor, the key is the scenario name, not the URL

[beenanner]

Good point @jpvincent. We discussed internally and I'm going to take a look at this to see of the feasibility of an implementation. Thank you @jpvincent @OffByNone @jessejacob for the feedback and details!

[beenanner]

@jpvincent / @OffByNone / @jessejacob pushed a POC to "url-aliases" branch if any of you want to check it out and let us know if it works for your use-cases.

Test Command
bin/sitespeed.js -b chrome -n 1 test/fixtures/sitespeed-urls-aliases.txt --graphite.host localhost

Contents of test/fixtures/sitespeed-urls-aliases.txt

https://www.sitespeed.io Home_Page
https://www.sitespeed.io/documentation/sitespeed.io/webpagetest/
https://www.sitespeed.io/documentation/sitespeed.io/browsers/ Docs_Browsers
https://www.sitespeed.io/faq FAQ

Result after pushing to Graphite

[beenanner]

This is in master now and scheduled for next release. :-)

[soulgalore]

Released today in 4.2.0.

[jpvincent]

Tested in 4.2.0, and it works

Many thanks !