In the not-so-distant past, crafting a simple rounded corner on a webpage was a formidable challenge, requiring intricate manipulation of layout grids, animations, and wrangling with browser limitations. However, today's web development landscape appears considerably less daunting. JavaScript has undergone numerous enhancements, the language itself has evolved, and DOM APIs, browser capabilities, CSS, bundlers, development tools, editors, and the entire platform have seen significant updates.
The Contemporary Era
Modern JavaScript frameworks have introduced diverse solutions to address client-side complexities, but they've also ushered in a new era of intricacy that troubles many, myself included. I was never an advocate of JSX; I believed that embedding HTML within our JavaScript code blurred the lines between concerns. Yet, the influence of conferences and tech giants gradually led to wider acceptance of this practice, even though it never quite felt right to me.
Time has a knack for illuminating the wisdom of certain ideas, and in the realm of software engineering, concepts tend to ebb and flow cyclically. Single Page Applications (SPAs) are no longer in vogue, and the idea of housing all HTML definitions inside JavaScript files has been recognized as detrimental to site performance due to the resulting bloated bundles.
Static site generation and server-side rendering have gained momentum as more performant alternatives. Moreover, these frameworks tend to lock developers into their ecosystems. Once you choose a front-end library, you're compelled to embrace their entire stack. This can be a frustrating experience, as I've personally witnessed projects rewritten from the ground up solely because React was chosen as the client-side library, necessitating a shift from platforms like Rails or PHP to Node.js.
But something is changing, a shift toward simplicity or greater agnosticism perhaps. I'm referring to emerging technologies like Astro and Htmx.
Astro and Htmx: The New Wave
With Htmx, you can leverage any back-end language, enhancing your HTML applications with directives and using the library to seamlessly replace DOM elements and update them with HTML responses. This approach bears resemblance to the days of .NET MVC, where partial views were returned for XMLHttpRequest.
Astro, on the other hand, allows you to remain within the Node.js realm for server-side rendering (SSR) while granting you the freedom to select any client-side library for static site generation (SSG).
This 'new' trend instills a glimmer of hope that we are returning to a simpler approach to web development. Frameworks, it seems, are obstructing the progress of many applications. As senior engineers who recall simpler times, even amidst technological limitations, it's crucial that we retain the capacity for critical evaluation.
My Contribution to the Community
As a tech lead and principal, working with teams necessitates a pragmatic approach. While staying updated with new technologies is vital, it's equally crucial to empower teams with the autonomy to choose their preferred tech stack. I have immersed myself in the realm of modern front-end frameworks for some time now.
However, I have steadfastly clung to the belief that we don't need the excessive complexities prevalent today. This conviction led me to initiate a project called "Jails" eight years ago. I had the privilege of testing this project in various applications within the companies I've collaborated with. The support and shared vision of like-minded developers encouraged me to pursue this indie project in critical applications.
The intent behind Jails was to create a contemporary client-side library that embodies several key principles:
- Agnosticism, enabling compatibility with any SSR or SSG system, as well as other vanilla JavaScript libraries.
- Simplicity and speed.
- Event-driven architecture with modern techniques like DOM diffing and local state management.
- Platform-oriented, aligning closely with vanilla JavaScript and browser compatibility.
- A functional approach, devoid of classes, 'this', decorators, private/public members, or inheritance. Functional, but deeply rooted in the JavaScript paradigm.
To utilize Jails, simply encapsulate the markup requiring dynamic behavior within a custom element and register a Component module in a separate JavaScript or TypeScript file containing the logic.
In summary, I've been working diligently with Jails, and I wholeheartedly believe it provides an elegant and classic approach to crafting client-side applications. I invite you to explore it, offer your suggestions, and join in on this project. You can find more information at https://jails-js.org/.
Thank you for your time, and until next time!
Top comments (0)