Lighthouse: Update programmatic example to delete results.artifacts

Created on 25 Jan 2018  路  6Comments  路  Source: GoogleChrome/lighthouse

I checked every 'report.html', file size of each report is larger than 20M bytes. It is impossible to serve on websites. Is there any way to shrink the size?

docs

Most helpful comment

Thanks for the analysis @kdzwinel let's add some of these to #4333 since there are some reasonable reliances on the duplication at the moment :)

@12d if you're using Lighthouse programmatically from node and building the report yourself, it's likely that you're forgetting to delete the .artifacts property before building the report HTML. If not, definitely give us a URL so we can check this out. I've never seen a real report be 20MB, they must have some gnarrly data URI images 馃槅

All 6 comments

Thank you for reporting! Can you please share a website for which you are getting such huge reports? I personally, haven't seen a report file larger than 1,5M. Lighthouse version used may also come in handy.


I did some quick analysis of our report files and the static part is ~150Kb, everything else goes into the __LIGHTHOUSE_JSON__.

Looking into __LIGHTHOUSE_JSON__ I found out that:
1) audit results are included twice (in .reportCategories and .audits),
1) additionally, audits that are shared between multiple categories (e.g. viewport) are repeated in each category,
1) extendedInfo, which makes a huge percentage of many audits, is included for all audits but only used in performance category.

Static part can also be slimmed down (we can minify js/css/html), but improvement here will be way less significant than what can be done with __LIGHTHOUSE_JSON__.

I can take a stab at points 1 and 2.

screen shot 2018-01-25 at 15 22 34

Thanks for the analysis @kdzwinel let's add some of these to #4333 since there are some reasonable reliances on the duplication at the moment :)

@12d if you're using Lighthouse programmatically from node and building the report yourself, it's likely that you're forgetting to delete the .artifacts property before building the report HTML. If not, definitely give us a URL so we can check this out. I've never seen a real report be 20MB, they must have some gnarrly data URI images 馃槅

Hey @patrickhulce ,
Could you let us know how to delete the .artifacts property? I just follow the example here and got a html file of 77.5MB.

@ganlanyuan if you're just trying to get the same result as the CLI and get a regular HTML report you can follow its lead

https://github.com/GoogleChrome/lighthouse/blob/278d1e7c1aae3bc6b0477ca1058c1188d858c9eb/lighthouse-cli/run.js#L170-L175

@patrickhulce Thanks!
I got the file size reduced to 2.4MB. It's amazing!
But still there is a big inline <script> starts from window.__LIGHTHOUSE_JSON__ = {"userAgent" which seems can't be reduced.

Yes that's the JSON results from which the HTML is rendered, so there's probably not any more immediate win. #4333 tracks several improvements to reduce the size but will be breaking changes (since we'll be removing properties)

Was this page helpful?
0 / 5 - 0 ratings

Related issues

johnfrancisli picture johnfrancisli  路  3Comments

nl-igor picture nl-igor  路  3Comments

dkajtoch picture dkajtoch  路  3Comments

shellscape picture shellscape  路  3Comments

sanprieto picture sanprieto  路  3Comments