3 ms·

Use of frameworks is often blamed for bloat, but the two are completely independent. React is about 110kB. Vue is 33kB. It's perfectly possible (and really not

Use of frameworks is often blamed for bloat, but the two are completely independent. React is about 110kB. Vue is 33kB. It's perfectly possible (and really not that hard) to write fast, small web apps with the big popular JS frameworks. It's the thoughtless stuff people do—pulling in huge libraries for tiny features, mandating the use of huge analytics packages, etc—that cause the bloat. Whether it should all just be server-rendered is a whole other argument, but if you're going to build something the size and scale of reddit as a client-rendered app, you'd be crazy to not use one of the existing frameworks IMO. If for no other reason than you're likely to end up just re-creating a worse version of them.

bscphil 5y ago
I think bloat really means two different things. One is the obvious "file size" issue, and as you are mentioning it's quite possible to write small sites even using heavy-weight frameworks. But a lot of the complaints in this thread boil down to modern sites being slow to run on computers that are only a few years old. If modern frameworks are to blame for that, it's not because they're a hundred (or more) KB. It's because they require the end user to run way more Javascript in the browser and consume far more memory than a site with minimal Javascript requires to accomplish the same thing. As a random example, Firefox's about:performance page says that the three YouTube tabs I have open are each consuming about 50 MB of my computer's memory. That's obscene. (None of the tabs are open on a video, so this is not the result of storing videos in RAM.) Also, I did a Lighthouse analysis of the Reddit home page in Chrome (on Desktop, but targeting mobile). The page scores less than 20/100 on performance, and takes almost twenty seconds to become interactive!! The biggest problem Lighthouse sees with the page is not the file size, but the amount of Javascript being executed. There's ~25 seconds of "main thread work" being done in my test.
- the__alchemist 5y ago
  Great point. React's DOM-diffing algorithm does many unnecessary computations that make websites run slowly compared to targeted DOM manipulation.

bscphil 5y ago

I think bloat really means two different things. One is the obvious "file size" issue, and as you are mentioning it's quite possible to write small sites even using heavy-weight frameworks. But a lot of the complaints in this thread boil down to modern sites being slow to run on computers that are only a few years old. If modern frameworks are to blame for that, it's not because they're a hundred (or more) KB. It's because they require the end user to run way more Javascript in the browser and consume far more memory than a site with minimal Javascript requires to accomplish the same thing. As a random example, Firefox's about:performance page says that the three YouTube tabs I have open are each consuming about 50 MB of my computer's memory. That's obscene. (None of the tabs are open on a video, so this is not the result of storing videos in RAM.) Also, I did a Lighthouse analysis of the Reddit home page in Chrome (on Desktop, but targeting mobile). The page scores less than 20/100 on performance, and takes almost twenty seconds to become interactive!! The biggest problem Lighthouse sees with the page is not the file size, but the amount of Javascript being executed. There's ~25 seconds of "main thread work" being done in my test.

the__alchemist 5y ago
Great point. React's DOM-diffing algorithm does many unnecessary computations that make websites run slowly compared to targeted DOM manipulation.