Embedding the bundle.js and styles into html

[codri]

Hi,

By the looks of it, embedding the bundle.js(8.2KB), main.css(1.5KB) into the document(3.1KB) can easily fit into the 14KB sweet spot(12.8KB in total, maybe even better when gzipped together).

It could show one of the sveltejs main selling points, its compactness. The webfonts, of course, will slow down the things, but I think there are ways to progressively add webfonts to the page(maybe even without triggering a layout recalculation) while rendering initially without them.

One could also draw some dummy elements on the screen, then once the data comes from the server, it could add the text and images into places.

It's a crowded place these days for webframeworks so achieving 100 score on lighthouse could attract more people. Shaving off a few roundtrips on 2G on mobile could result in a higher score.

Resources about the 14KB TCP slow start window:

• https://webcache.googleusercontent.com/search?q=cache:ndY9SwQoA2AJ:https://tylercipriani.com/blog/2016/09/25/the-14kb-in-the-tcp-initial-window/+&cd=1&hl=en&ct=clnk

• https://webmasters.stackexchange.com/questions/89056/from-which-file-size-is-it-worth-to-implement-images-as-data-uri

Link for the progressive web fonts loading(hacks of course):

• https://www.filamentgroup.com/lab/font-events.html