My Opinionated Way of building Performant Websites
Disclaimer: I would like to start this series as a way for me to go back to the practice of writing again. As such, I would also like to use this opportunity to document my practices and to hone my craft by opening it up to the reader and be open to suggestions for improvement.
Given above, this is currently my way of building performant websites, and through the following notes that I will add through the weeks, I will show my thinking process and design decisions on how I build my websites. I would also go deep dive on concepts that I think would be necessary to understand so as to make sure that you can also build performant websites.
The only thing that I can think of that might be a downside for this is that I created most of the library that I will be using (and most of them are re-hash or an amalgamate of things that I need, copied from other libraries that I reversed engineered). That means you will not see the usual “How to build a web app using <favorite-framework/library>” here.
With that out of the way, what are the topics that I would be talking about?
But before that, just a story: I remember I gave a list of requirements that a web developer should have to be part of web project that I was working on. Some of them are:
- Basic CSS Knowledge
- Proper usage of Flex (for 1 dimension)
- Proper usage of Grid (for 2 dimensions and layout)
- Usage of box-sizing, margins, and padding
- Basic JS Knowledge
- Scoping and meaning of the word
- Proper usage of function binding
- arrow functions
- when to use
- array and object deconstructions
- proper usage of async/await
- array.map and reduce
- Basic Browser APIs including:
- Fetch API
- querySelector (effectively replaces jQuery)
- Usage of event listeners and CustomEvent API
- The concept of event queues and microtasks
- Web components (Custom Elements) and lifecycle
and my friend gave me: it would be hard to get this from a fresh graduate. And I thought these are basics (either that or I might have some form of the other side of Dunning-Kruger effect)
So these are the topics that I would touch and many more, as well as backend, project design and planning, usage of CIs, and other things.
So, here’s to a start. If you have questions or some things that you want me talk, don’t hesitate to comment here.