Hacker News Reader

Comment by fxbl0i | Hacker News Reader

I assume people who don't think about DOM manipulation and the performance toll it takes are responsible for how slow the web is today and, what's even worse, how that waste of CPU has been pushed from the server to the client.

View on HN

I assume the web is slow today due to packing a couple megabytes of libraries, and adware / tracking malware, into each page load. More so than two milliseconds of jank in how you constructed that SELECT pulldown.

I don't believe that contemporary webdev's main problem is how we construct a SPA. I think it's the assumption that everything needs to be a SPA.

There's downsides with every approach though. While taking a "render HTML and manipulate DOM" approach falls down hard when the DOM mutations become frequent or complicated enough that they take a performance toll, the alternative most commonly peddled, "ship JSON and let the client render everything" has increased in massively increased JS bundle sizes and horrendous initial load performance on many sites.

I suppose there's the alternative of "ship HTML and forget about Javascript for the most part", but very, very few people are following that nowadays, and besides which, JQuery supports a "Javascript not required" progressive enhancement model far far more than most other front-end frameworks.

I wrote a spa at my last job using jQuery. It rendered page fragments on a php backend, detached the current fragment, saved it, then appended the new fragment. If a fragment was already downloaded it would hydrate by ajaxing some json.

It was extra work and sometimes brittle but it was also my first "big" web project. Even though it didn't use all the cool new libs and build tools I still learned a lot from it.

That's brilliant! Have you had the opportunity to play with Turbolinks 5? It sounds like there will be some crossover with what you have already done, but if you're intellectually curious, you might pick up some good tricks, too.

https://github.com/turbolinks/turbolinks

https://www.youtube.com/watch?v=SWEts0rlezA&t=3m22s

TL5 just happens to pair beautifully with a tiny library called Stimulus, which would be YAF except that it's a) by the same team as TL5 and b) that team is also behind Rails, so there's some claim to legitimate best practices.

https://stimulusjs.org/

This is awesome! Thanks!

Can you please point me to some evidence of how bad DOM manipulation actually is ? Its worked just fine for all my professional use-cases so far. Enlighten me!

crickets

Reply on news.ycombinator.com