4 ms·

Damn... I'm at 17.2KB for my home page! (not including dependencies) FWIW I optimised the heck out of my personal homepage and got 100/100 for all Lighthouse s

Damn... I'm at 17.2KB for my home page! (not including dependencies) FWIW I optimised the heck out of my personal homepage and got 100/100 for all Lighthouse scores. Which I had not previously thought possible LOL Built in Rails too! It's absolutely worth optimising your site though. It just is such a pleasing experience when a page loads without any perceptible lag!

ghoshbishakh 1y ago
rails has nothing to do with the rendered page size though. Congrats on the perfect lighthouse score.
- Alifatisk 1y ago
  Doesn't Rails asset pipeline have an effect on the page size, like if Propshaft being used instead of Sprockets. From what I remember, Propshaft intentionally does not include minification or compression.
  - firecall 1y ago
    It’s all Rails 8 + Turbo + Stimulus JS with Propshaft handling the asset bundling / pipeline. All the Tailwind building and so on is done using common JS tools, which are mostly standard out of the box Rails 8 supplied scripts! Sprockets used to do the SASS compilation and asset bundling, but the Rails standard now is to facilitate your own preferences around compilation of CSS/JS.
- firecall 1y ago
  Indeed it does not :-) It was more a quick promote Rails comment as it can get dismissed as not something to build fast website in :-)
apt-apt-apt-apt 1y ago
Yeah, the fact that news.ycombinator.com loads instantly pleases my brain so much I flick it open during downtime automonkey-ly
- Alifatisk 1y ago
  Lobsters, Dlangs forum and HN is one of the few places I know that loads instantly, I love it. This is how it should be like!
  - lexoj 1y ago
    Dlang.org?
    - Alifatisk 1y ago
      forum.dlang.org
  - Capricorn2481 1y ago
    Although Lobsters is 4x the size and loads about as well.
leptons 1y ago
I did a lot of work optimizing the template code we use on thousands of sites to get to 100/100/100/100 scores on Lighthouse. We also score perfect 100s on mobile too. It was a wild adventure. Our initial page load is far bigger than 17.2KB, it's about 120KB of HTML, CSS, and JS. The big secret is eliminating all extra HTTP requests, and only evaluating JS code that needs to run for things "above the fold" (lazy-evaluating any script that functions below the fold, as it scrolls into view). We lazy-load everything we can, only when it's needed. Defer any script that can be deferred. Load all JS and CSS in-line where possible. Use 'facade' icons instead of loading the 3rd-party chat widget at page load, etc. Delay loading tracking widgets if possible. The system was already built on an SSR back-end, so SSR is also a big plus here. We even score perfect 100s with full-page hires video backgrounds playing at page load above-the-fold, but to get there was a pretty big lift, and it only works with Vimeo videos, as Youtube has become a giant pain in the ass for that. The Google Lighthouse results tell you everything you need to know to get to 100 scores. It took a whole rewrite of our codebase to get there, the old code was never going to be possible to refactor. It took us a whole new way of looking at the problem using the Lighthouse results as our guide. We went from our customers complaining about page speeds, to being far ahead of our competition in terms of page speed scores. And for our clients, page speed does make a big difference when it factors into SEO rankings (though it's somewhat debatable if page speed affects SEO, but not with an angry client that sees a bad page speed score).

ghoshbishakh 1y ago

rails has nothing to do with the rendered page size though. Congrats on the perfect lighthouse score.

Alifatisk 1y ago
Doesn't Rails asset pipeline have an effect on the page size, like if Propshaft being used instead of Sprockets. From what I remember, Propshaft intentionally does not include minification or compression.
- firecall 1y ago
  It’s all Rails 8 + Turbo + Stimulus JS with Propshaft handling the asset bundling / pipeline. All the Tailwind building and so on is done using common JS tools, which are mostly standard out of the box Rails 8 supplied scripts! Sprockets used to do the SASS compilation and asset bundling, but the Rails standard now is to facilitate your own preferences around compilation of CSS/JS.
firecall 1y ago
Indeed it does not :-) It was more a quick promote Rails comment as it can get dismissed as not something to build fast website in :-)

apt-apt-apt-apt 1y ago

Yeah, the fact that news.ycombinator.com loads instantly pleases my brain so much I flick it open during downtime automonkey-ly

Alifatisk 1y ago
Lobsters, Dlangs forum and HN is one of the few places I know that loads instantly, I love it. This is how it should be like!
- lexoj 1y ago
  Dlang.org?
  - Alifatisk 1y ago
    forum.dlang.org
- Capricorn2481 1y ago
  Although Lobsters is 4x the size and loads about as well.

leptons 1y ago

I did a lot of work optimizing the template code we use on thousands of sites to get to 100/100/100/100 scores on Lighthouse. We also score perfect 100s on mobile too. It was a wild adventure. Our initial page load is far bigger than 17.2KB, it's about 120KB of HTML, CSS, and JS. The big secret is eliminating all extra HTTP requests, and only evaluating JS code that needs to run for things "above the fold" (lazy-evaluating any script that functions below the fold, as it scrolls into view). We lazy-load everything we can, only when it's needed. Defer any script that can be deferred. Load all JS and CSS in-line where possible. Use 'facade' icons instead of loading the 3rd-party chat widget at page load, etc. Delay loading tracking widgets if possible. The system was already built on an SSR back-end, so SSR is also a big plus here. We even score perfect 100s with full-page hires video backgrounds playing at page load above-the-fold, but to get there was a pretty big lift, and it only works with Vimeo videos, as Youtube has become a giant pain in the ass for that. The Google Lighthouse results tell you everything you need to know to get to 100 scores. It took a whole rewrite of our codebase to get there, the old code was never going to be possible to refactor. It took us a whole new way of looking at the problem using the Lighthouse results as our guide. We went from our customers complaining about page speeds, to being far ahead of our competition in terms of page speed scores. And for our clients, page speed does make a big difference when it factors into SEO rankings (though it's somewhat debatable if page speed affects SEO, but not with an angry client that sees a bad page speed score).