6 ms·
EDIT: As I wrote this, someone deployed a server-side rendered version of the site. Now the site is perfect. :) This site appears to load ~350 KB of JavaScript
by ascom 9y ago
EDIT: As I wrote this, someone deployed a server-side rendered version of the site. Now the site is perfect. :)
This site appears to load ~350 KB of JavaScript, which I think is a bit excessive for a "lite" text-only site. From the sourcemaps, I found a long list of libraries, including:
* react
* redux
* redux-thunk
* react-router
* axios
* base64-js (why not window.atob/btoa?)
* core-js
* fbjs
* react-hot-loader (should not be in a production build)
* ...a bunch of other smaller modules
There's only about 10 KB of non-library application code. Note that I ignore gzip when evaluating this sort of stuff, since that many bytes of code still need to be parsed, no matter how much it compresses.
For the person who made this site, I would replace React with Preact (or Inferno), which should remove most of the bloat. Server side rendering would also be nice for those who don't have JavaScript enabled and would also improve the loading time.
At least it's still better than cnn.com. http://www.webpagetest.org/result/170910_C8_e78305788a19b0fb12e2413251baf9b2/ http://www.webpagetest.org/result/170910_C8_e78305788a19b0fb...
- crabasa 9y ago>> At least it's still better than cnn.com. That's literally the entire value prop of the website. The author isn't obligated to use your personal list of approved web tools.
- a012 9y agoThis reveals why I didn't see anything on my phone on first time visiting it. My browser just show a blank page, then seconds later the contents show up.
- jimktrains2 9y agoWhat's worse all the content is sent inline, just not as html :( Why complicate this so much?
- earenndil 9y agoFWIW the site still looks fine with noscript enabled.
- jordache 9y agoWTF? why any JS at all for something that's pure content?
- na85 9y agoHistory repeats itself. This is just like flash sites back in the 90s.
- TomMarius 9y agoIt has no benefit on the client itself, but in this (server-rendered) case, you can think of it as improved PHP/Ruby/....
- josteink 9y agoThe question wasn't why anyone was using Javascript on the server. The question was why a pure-text non-interactive website needs any javascript at all.
- TomMarius 9y agoBecause when you're treating React as a templating language, it's easier to let it run on the client side during development and add server rendering later.
- jimktrains2 9y agoSeems like it'd be easier to just use the templates already there for the content on the server, instead of building an additional application.
- jordache 9y agoi don't know react. Can you elaborate what you mean using React as a templating language? Are you saying react can be used sans any business logic and purely for template interpolation?
- 9y ago
- gfyrt 9y agoTrump literally effected CNN to consider human tolerancy to their questinable content!
- heipei 9y agoAlmost anything is better than CNN: https://urlscan.io/result/6834c63f-b092-4e4e-b72b-91bd1c1b82c4 https://urlscan.io/result/6834c63f-b092-4e4e-b72b-91bd1c1b82... This is on par with other shitty news-websites. This website contacted 65 IPs in 7 countries across 35 domains to perform 314 HTTP transactions. [...] In total, 4 MB of data was transfered, which is 12 MB uncompressed. It took 2.753 seconds to load this page. Compare this to the now-SSR cnn.io: https://urlscan.io/result/7d13efac-ffaa-4ac2-a091-8611e39b20b2 https://urlscan.io/result/7d13efac-ffaa-4ac2-a091-8611e39b20... (59kB transfer) Edit: Someone scanned the lite-version before they switched to SSR: https://urlscan.io/result/2a9690eb-3992-4712-a657-c3be959d51f9 https://urlscan.io/result/2a9690eb-3992-4712-a657-c3be959d51...
- V99 9y agoFWIW, base64-js and similar libraries are still needed (though probably not in this case...) because window.btoa() only works on latin1 ASCII strings. Try giving it some arbitrary UTF-8: btoa("\ud83d\ude0b") -> Uncaught DOMException: Failed to execute 'btoa' on 'Window': The string to be encoded contains characters outside of the Latin1 range. (Edit: apparently HN doesn't either; changed to \u...)
- josteink 9y ago> FWIW, base64-js and similar libraries are still needed For what? This is a non-interactive text-only website. It shouldn't need anything beside HTML and CSS.
- eadmund 9y agoYou are 100% correct. Honestly, it doesn't need CSS even, although that's nice to have. I've got NoScript on, and now the pages load perfectly. I think I may return to being a CNN reader now. If only they could figure out how to monetise this.
- V99 9y agoFor the rest of the sentence... I was clearly referring to the question of why someone would use a library for base64 versus the built-in function. Not getting involved in the anti-js internet pitchfork mob.