🧠 50 Articles to Level Up

#webdev #javascript #frontend #node

Image by Freepik

This year I started a new series on LinkedIn - "Advanced Links for Frontend". Each issue has 10 links to outstanding posts / articles. This bundle contains the links from the last 5 issues (issue 16 to issue 20).

Issue 16

WebKit Features in Safari 17.4 (https://webkit.org/blog/15063/webkit-features-in-safari-17-4/) by Jen Simmons and Jon Davis
This is a good one - especially with the improvements for web apps on Mac and the enhanced declarative shadow DOM.
Top 8 Recent V8 in Node Updates (https://blog.appsignal.com/2024/02/28/top-8-recent-v8-in-node-updates.html) by Antonello Zanini
Finally the dynamic imports also work with "with".
Announcing TypeScript 5.4 (https://devblogs.microsoft.com/typescript/announcing-typescript-5-4) by Daniel Rosenwasser
The NoInfer utility type might be more useful than I can infer right now.
A Next.js package for managing third-party libraries (https://developer.chrome.com/blog/next-third-parties) by Houssein Djirdeh
So larger applications are less performant? Get out of here!
10 Must have VS Code Extensions for Developers in 2024 (https://dev.to/durgesh4993/10-must-have-vs-code-extensions-for-developers-in-2024-1m83) by @durgesh4993
I don't know if I must have them, but I do have them. Except, that my Quokka.js license expired.
Astro 4.5 (https://astro.build/blog/astro-450/) by Erika, Emanuele Stoppa, Matthew Phillips, Nate More, Bjorn Lu
The new script detection is actually quite great.
Top Headless UI libraries for React in 2024 (https://www.greatfrontend.com/blog/top-headless-ui-libraries-for-react-in-2024) by Feilin Liangga Putri
I think this is a good collection of superb libraries.
How to Build a Masonry Layout Using CSS (https://hackernoon.com/how-to-build-a-masonry-layout-using-css) by Abhigyan
Watch out for the end - the perspective usage is outstanding.
Things I learned while building my JS libary (https://dev.to/mathuraditya7/things-i-learned-while-building-my-js-library-2k06) by Aditya Mathur
Long story short: It's more work than it seems like.
PixiJS v8 Launches! 🎉 (https://pixijs.com/blog/pixi-v8-launches) by GoodBoyDigital
Supercharge your animation skills.

Issue 17

Microsoft announces Privacy-Preserving Ads API for Microsoft Edge (https://www.neowin.net/news/microsoft-announces-privacy-preserving-ads-api-for-microsoft-edge/) by Taras Buria
If there is one thing the Internet needs more then its ads. Not. But at the end of the day we all need to eat, right?
Ultimate Guide to Visual Testing with Playwright (https://www.browsercat.com/post/ultimate-guide-visual-testing-playwright) by Mike Stop Continues
Playwright is just wonderful until the point where you need to maintain your E2E tests.
ONNX Runtime Web unleashes generative AI in the browser using WebGPU (https://cloudblogs.microsoft.com/opensource/2024/02/29/onnx-runtime-web-unleashes-generative-ai-in-the-browser-using-webgpu/) by Emma Ning, Yulong Wang, Satya Jandhyala
I can't wait to give all my resources to some algorithm producing known answers with a high chance of error.
Building A Custom Renderer For React (https://blog.openreplay.com/building-a-custom-react-renderer) by Daniel Onyebuchi
It actually sounds more complicated than it is - but I think the journey is definitely the goal here.
Web Workers: Revolutionizing Web Performance and User Experience (https://dev.to/bymarsel/web-workers-revolutionizing-web-performance-and-user-experience-3i1b) by @bymarsel
Not to confuse with service workers - these are siblings, but they have different life times and purposes.
5 Exciting New JavaScript Features in 2024 (https://www.sitepoint.com/new-javascript-ecmascript) by Olivia Gibson, Darren Jones
You already had me at "5".
Astro + Volar = 💖 (https://astro.build/blog/astro-and-volar) by Erika
For many people this is just esoteric, but honestly I think that having a sound reusable basis for language servers is super cool!
Announcing AnalogJS 1.0 (https://dev.to/analogjs/announcing-analogjs-10-19an) by @analogjs_team
I can't believe this wasn't a 1.0 beforehand. Glad it happened now!
Making Your Code Type-Safe with Zod (https://www.telerik.com/blogs/making-your-code-type-safe-zod) by Leonardo Maldonado
Well, Zod is the reference for quite some time - or should we say "runtime" (pun intended)?
Navigating the future of frontend (https://frontendmastery.com/posts/navigating-the-future-of-frontend/) by Remi
Pretty much all in there except micro frontends - can I take this one seriously?! Yes.

Issue 18

Free Tool Helps Web Devs with Google’s ‘Complex’ SEO Update (https://thenewstack.io/free-tool-helps-web-devs-with-googles-complex-seo-update/) by Loaine Lawson
You had me at free - I was just hoping for a follow-up with "beer"; but tools are almost as good.
Interaction to Next Paint is officially a Core Web Vital (https://web.dev/blog/inp-cwv-launch) by Rick Viscomi
INP will be the new 3 letter thing everyone will talk about but no one truly understands.
Announcing Speedometer 3.0: A Shared Browser Benchmark for Web Application Responsiveness (https://browserbench.org/announcements/speedometer3/) by Webkit contributors
So far the only thing I found out is that my browser is slow.
Rust-based WinterJS web server reaches 1.0 (https://www.infoworld.com/article/3714444/rust-based-winterjs-web-server-reaches-10.html) by Paul Krill
The season before Spring is Winter. Next up: Summer.NET.
React vs. Angular: Component Architecture (https://www.telerik.com/blogs/react-vs-angular-component-architecture) by Christian Nwamba
Luckily we now have standalone components to make both of them similarly looking.
Capo.js: A five minute web performance boost (https://frontendmasters.com/blog/capo-js-a-five-minute-web-performance-boost/) by Dave Rupert
Who would have thought that the order of elements within a header plays such a crucial role?
How to Implement Micro Frontends Using SystemJS: A Comprehensive Guide (https://dev.to/confrontend/how-to-implement-micro-frontends-using-systemjs-a-comprehensive-guide-i3a) by Hamed Fatehi
Been there, done that. Actually, there are a few more things that can get handy here - but then I'd recommend using Piral right away.
Announcing Rsbuild v0.5 (https://rsbuild.dev/community/releases/v0-5) by rsbuild contributors
We are getting closer to something I'd call worthy of a v1. Great job!
Type system of the React compiler (https://www.recompiled.dev/blog/type-system/) by Sathya Gunasekaran
It turns out that types are crucial for optimizing anything.
The Mechanics of Async Await (https://blog.resonatehq.io/async-await-mechanics) by Dominik Tornow
I'm a huge fan of Elixir and async / await (coming a long way when it was introduced in C#). Great article!

Issue 19

Rendering a Million Rows in React by Drawing (https://dev.to/keyurparalkar/rendering-a-million-rows-in-react-by-drawing-1a39) by @keyurparalkar
A million is not cool. You know what's cool? A billion.
Angular will be merged with Wiz (https://rubenperegrina.com/angular-will-be-merged-with-wiz) by Rubén Peregrina
I'd rather call this an assimilation.
Goodbye SASS 👋, welcome back native CSS (https://dev.to/karsten_biedermann/goodbye-sass-welcome-back-native-css-cf) by @karsten_biedermann
There are still features in SASS that make it worth using.
Comparing JavaScript Frameworks part 1: templates (https://www.maartenhus.nl/blog/comparing-javascript-frameworks-part-1-templates/) by Maarten Hus
This is actually where the different philosophies are fully exposed.
HTTP Speed (https://kitsonkelly.com/posts/http-speed) by Kitson P. Kelly
Interesting data - especially on Node 21 vs Node 20.
The one about the web developer job market (https://www.baldurbjarnason.com/2024/the-one-about-the-web-developer-job-market) by Baldur Bjarnason
In short: Not great, not terrible.
Optimizing Javascript for fun and for profit (https://romgrk.com/posts/optimizing-javascript) by Rom Grk
Why not just for fun? Well, I see what you did there!
There is no EU cookie banner law (https://www.bitecode.dev/p/there-is-no-eu-cookie-banner-law) by Bite Code!
May that is it be, you won't get rid of them now.
Accessible Forms with Pseudo Classes (https://css-tricks.com/accessible-forms-with-pseudo-classes/) by Chris DeMars
Friends don't let friends create inaccessible forms.
Build a Node App with TypeScript (https://www.totaltypescript.com/typescript-and-node) by Matt Pocock
You got me at "Build". Wouldn't do exactly the same combination, but it's definitely a good one.

Issue 20

The road to Fresh 2.0 (https://github.com/denoland/fresh/issues/2363) by Marvin Hagemeister
Can't wait for seeing the end of the road! All in all great changes ahead.
Migrating 500+ tests from Mocha to Node.js (https://astro.build/blog/node-test-migration/) by Emanuele Stoppa and Bjorn Lu
Fast tests are an important foundation for developer efficiency.
Why TypeScript Doesn't Include a throws Keyword (https://www.learningtypescript.com/articles/why-typescript-doesnt-include-a-throws-keyword) by Josh Goldberg
At this point I am convinced that TypeScript will continue to eat everything.
Diving into the Node.js Website Redesign (https://nodejs.org/en/blog/announcements/diving-into-the-nodejs-website-redesign) by Brian Muenzenmeyer
Super interesting - especially if you think about following a similar path.
Headless UI - a great components library for Vue & React (https://dev.to/jacobandrewsky/headless-ui-a-great-components-library-for-vue-react-4k35) by @jacobandrewsky
I love that headless UIs are getting more and more traction. Also check out React Aria if you are in that space.
Power of Partial Prerendering with Bun (https://aralroca.com/blog/partial-prerendering) by Aral Roca
The question is, however, if you really want to run Bun in production at this point.
JavaScript Visualized: Promise Execution (https://www.lydiahallie.com/blog/promise-execution) by Lydia Hallie
Every once in a while there are superb visualizations of core concepts - this is one of them.
A scaleable alternative to Tailwind, BEM, and CSS-in-JS (https://nuejs.org/blog/introducing-nue-css/) by Tero Piirainen
There are a couple of interesting CSS-in-JS alternatives - have development efficiency without paying for it at runtime.
⚛️ Folder Structures in React Projects (https://dev.to/itswillt/folder-structures-in-react-projects-3dp8) by @itswillt
This is certainly a good selection that you can apply when you don't have settled on a meaningful structure yet.
Introducing “pages router” (https://waku.gg/blog/introducing-pages-router) by Sophia Andren
Waku continues to become as generic and useful as it can be. Just don't become the next Next.js - stay lightweight and flexible.