HTTPArchive
Tech Report: Replicate sort functionality from IsMyHostFastYet.com
I'm looking to replicate IsMyHostFastYet.com (IMHFY) using Tech Report. A key feature of IMHFY is the ability to sort the results in different ways:
Such sorting controls are absent from a similar view on the Tech Report:
It would be able to sort by any of the columns, including origins, Good CWV, A11Y, and SEO. (It would also be useful to have Lighthouse score and Page weight here.)
Being able to sort by "Good CWVs" would be very helpful to "rank" hosts in terms of their performance. Additionally, IMHFY is presenting the hosts in terms of their TTFB whereas the Tech Report is showing CWV in the summary table. It would be useful to be able to change the "Good CWVs" column to present "Good TTFB" instead, in addition to perhaps being able to sort by "Average TTFB" and "Poor TTFB".
Such metric selection is available in the Core Web Vitals section below:
But it isn't available in the Summary.
I'm also noticing that the order of the technologies in the Summary table corresponds to the original order that they were selected. Being able to sort these alphabetically would be useful so that if they are to be presented alphabetically that the technologies don't have to be selected in alphabetic order initially.
I did make a bookmarklet that applies the desired sort:
javascript:Array.from(document.querySelector('.table-ui-wrapper tbody').children).sort( ( a, b ) => parseInt(a.querySelector('td.cwv-cell').getAttribute('data-value')) - parseInt(b.querySelector('td.cwv-cell').getAttribute('data-value')) ).map((row) => document.querySelector('.table-ui-wrapper tbody').prepend(row))
| Before | After |
|---|---|
Although that's just one small piece here.
Ignore this, was looking at the wrong screen. Raised that as a separate issue: https://github.com/HTTPArchive/httparchive.org/issues/1081
~@max-ostapenko can you look into how this could be done in the backend for the Categories screen since the pagination was done for performance reasons as we have a lot more technologies than IsMyHostFastYet.com had.
I guess we need extra URL params to define sort order (i.e. which column to sort by), and also client. Which might also find that bug you noted about the fact sort order is currently based on mobile origins now, even when on desktop.~
@sarahfossheim can you look at how this could be done in the Comparison screen since that shouldn't require any API changes.
See example where the technologies have been re-ordered so that the table is sorted by having good CWV.