I saw that the Lighthouse audits had been updated, so I ran them again on Discourse. It’s probably a good idea to revisit these every few months!
I’m going to highlight the problems reported.
Metrics: First meaningful paint: 4,510 ms
This is a well-known problem for Discourse on an empty cache.
Opportunity: Reduce render-blocking stylesheets: 350ms
External stylesheets are blocking the first paint of your page. Consider delivering critical CSS via
<style>tags and deferring non-critical styles.
350ms, 252KB /stylesheets/mobile_060ac2f….css?__ws=meta.discourse.org 325ms, 0.71KB /stylesheets/mobile_theme_28_02452c4….css?__ws=meta.discourse.org
Enable text compression: 170ms / 201KB
Text-based responses should be served with compression (gzip, deflate or brotli) to minimize total network bytes.
Original: 251 KB GZIP Savings: 201 KB (80%) /stylesheets/mobile_060ac2f….css?__ws=meta.discourse.org
This seems like an oversight in CDN configuration!
Serve images in next-gen formats: 82KB
A couple avatars got detected as being pictures, and more suited to JPG than PNG.
Includes a nice breakdown of the JS costs! 191ms in the PreloadStore evaluation seems like a lot.
|URL||Script Evaluation||Script Parsing & Compile|
|/assets/application-8a24d8e….br.js||156 ms||282 ms|
|/assets/ember_jquery-a8dcbd3….br.js||272 ms||20 ms|
|/||191 ms||49 ms|
|/assets/vendor-5a5945e….br.js||82 ms||58 ms|
|/js/contentscript.js||129 ms||10 ms|
|/content.js||66 ms||9 ms|
|…locales/en-b144a97….br.js||49 ms||22 ms|
|/content.js||59 ms||5 ms|
|/assets/plugin-a65ebde….br.js||9 ms||46 ms|
|/page.js||31 ms||15 ms|
|/scripts/description.js||36 ms||1 ms|
|/assets/pretty-text-bundle-55bf606….br.js||9 ms||13 ms|
|/assets/plugin-third-party-a6c7ec5….br.js||1 ms||18 ms|
- Main thread work breakdown: 3,800 ms
Cut this down to just the big ones.
|Parsing HTML & CSS||Parse HTML||1,771 ms|
|Script Evaluation||Evaluate Script||1,052 ms|
|Script Parsing & Compile||Compile Script||561 ms|
- Color contrast issues, again. Mostly complaining about the “thread started a long time ago” tags and the excerpt from pinned topics.
- Meta tags used properly
[user-scalable=“no”] is used in the element or the [maximum-scale] attribute is less than 5.
Disabling zooming is problematic for users with low vision who rely on screen magnification to properly see the contents of a web page. Learn more.
- 7 passed audits, plus extra manual checks which I believe we’ve gone over before and improved.
Blocking scrolling listener - ember_jquery.js is adding a blocking scrolling listener, flag the listener as
passiveto improve performance
- Known vulnerability (Medium) in jQuery 2.2.0
- Complaints about small font size - it says 64% legible (>16px), and the goal is 75%.