Well yes, no one can disagree with "there are trade-offs to every decision you make... sometimes you need javascript to do x y z"

The point is that too many people are making the wrong choices and are inflicting JS where it isn't needed.

But I'm not just talking about JS. Too many images, requests for other resources, make websites needlessly slow.

Most of the tutorials you will see on this website are about using react/vue/whatever but very little seems to be dedicated into the art of making your website performant and accessible with simple technologies; and that is reflected on a lot of the internet today.

Part of the purpose of frameworks like Vue, React, Angular, etc., is to make sites more performant as well as manageable. There's a ton of info about improving performance out there. Just follow people like @addyosmani , @paul_irish and @lukew to name a few. This site is new so give it some time and you'll start to see more content like that. Heck, you should write about the things you do to boost performance on here. You might just start a trend or at least spark some interest in others to do the same. :)

I just finished rebuilding a legacy app in Vue.js. It contained ~30 pages and was basically just a super long form.

The change in performance between an ASP.NET MVC view rendered with Razor and one rendered as a SPA in Vue was staggering. The entire app weighs in at only 450kb and page load times went from an average of 3 seconds, to 500ms. It's also a billion times more maintainable.

So it was taking three seconds to load a form. Thirty pages of forms were taking on average three seconds. So some of them were taking longer than three seconds to load. To load an HTML form.

Look, I'm not doubting that you got a huge performance boost by moving to Vue. Great work!

I'm just wondering what the original version was doing to take so long to render a form.

Several large JS and jQuery libraries were being loaded to perform specific validations, masking and calculations of card numbers and other input events, of which 90% of the library was unused. Also, since the page now loads the view model asyncronously on load via AJAX, rather than binding directly to it via Razor, there's no render blocking happening.

SPA frameworks in particular are good on slower connections because the browser does most of the work up front to load the page structure and resources.

I must be missing something here, because for a sane content oriented site, page structure should not be much larger than the content, and resources would be cached.

Also, it takes time to load the stuff up front, so you're trading speed of second and later page loads for the speed of the first one. That is not necessarily a good trade-off.

Indeed

I feel like I could write another post entirely about the fetish of initial page load at the expense of the performance of everything else.

You totally should. I would read it. People freak out over this.

There are a handful of fast languages, Go, Elixir etc.. that are excellent at rendering html very quickly. For slower languages, using simple caching can speed things up considerably as well as optimizing queries using EXPLAIN in sql.

code of conduct - report abuse