3 ms·

> If you make a page of X bytes, Y number of resources of Z bytes, you can pretty easily calculate load time ranges for a variety of network conditions. To exp

> If you make a page of X bytes, Y number of resources of Z bytes, you can pretty easily calculate load time ranges for a variety of network conditions. To expand on Cthulhu_'s point: I agree with the gist here but I think this is a bit of a simplification. From the user's point of view, fast downloading is only part of the picture. There's also the matter of render time, the dreaded flash of unstyled content, and related irritations such as banners and popups that appear after the page has seemingly finished rendering. (Wikipedia's current fund-raising drive commits this sin, perhaps deliberately.) All of these things contribute to a sense of the page 'getting in your way'. edit Another one for the list: distracting autoplaying videos. The Ars Technica site does this, for instance. Sites like Pinboard and HackerNews are compact in terms of avoiding bloated JavaScript, but importantly they also stay out of your way in terms of UX.

giantrobot 6y ago
The flash of unstyled content, even on slow shitty connections, is unnecessary and entirely my point. If you include a style tag with some bare minimum CSS (or even all your CSS) there will be no unstyled flash because the browser's already got CSS for the document. A 50KB page, about ten pages worth of text (20kb) and the rest markup and CSS, will load in under two seconds on a shitty 3G connection. There will be no unstyled flash and even on super low end devices first paint will happen a fraction of a second after the document finishes loading. You can do a lot of nice styling in 20kb of CSS. You could even include some inline SVG graphics/logo out of that budget. With compression which every browser supports you've got an even large budget because you can easily see 2:1 compression ratios on text with just GZip. If you include explicit sizes for things like image and video tags (width and height attributes) the browser won't need to reflow the layout as those resources lazy load in after the page load. There's no popping or things "getting in the way" if you don't write your page like an asshole or pretend you don't know anything about the content ahead of time. Anymore browsers support explicit lazy loading and media source sets. Not using those sorts of features is just laziness or ignorance on the part of web devs. My first experiences on the Internet were at the end of a shitty dial-up connection with at best a quarter second of latency. Those experiences have stuck with me and I'm appalled and even a bit offended when a "web page" is larger than a copy of Doom. It's especially egregious when a page weighs that much to display a couple paragraphs of text. Edit: fixed autocorrect typo

giantrobot 6y ago

The flash of unstyled content, even on slow shitty connections, is unnecessary and entirely my point. If you include a style tag with some bare minimum CSS (or even all your CSS) there will be no unstyled flash because the browser's already got CSS for the document. A 50KB page, about ten pages worth of text (20kb) and the rest markup and CSS, will load in under two seconds on a shitty 3G connection. There will be no unstyled flash and even on super low end devices first paint will happen a fraction of a second after the document finishes loading. You can do a lot of nice styling in 20kb of CSS. You could even include some inline SVG graphics/logo out of that budget. With compression which every browser supports you've got an even large budget because you can easily see 2:1 compression ratios on text with just GZip. If you include explicit sizes for things like image and video tags (width and height attributes) the browser won't need to reflow the layout as those resources lazy load in after the page load. There's no popping or things "getting in the way" if you don't write your page like an asshole or pretend you don't know anything about the content ahead of time. Anymore browsers support explicit lazy loading and media source sets. Not using those sorts of features is just laziness or ignorance on the part of web devs. My first experiences on the Internet were at the end of a shitty dial-up connection with at best a quarter second of latency. Those experiences have stuck with me and I'm appalled and even a bit offended when a "web page" is larger than a copy of Doom. It's especially egregious when a page weighs that much to display a couple paragraphs of text. Edit: fixed autocorrect typo