Is Frontend Development really that difficult?
It’s widely becoming common to accept that Frontend development is much harder than Backend development. It’s easier, and in some sense true as well to say that “it depends”. The nature of the complexities are different from one another as it requires the developer to wear different hats. With backend development, you have your common variety problems of performance optimization, scalability, database management, monitoring, security, and reliability. And with frontend development, you have issues like bundle size reduction, code-splitting, cross-browser compatability, performance optimization, responsiveness and source-maps for debugging. Figuring out the design of a backend system so that it addresses the BE problems in an efficient way is completely different from figuring out an optimal way to solve the various problems associated with a frontend of an application.
The problem with frontend development is that there are way too many standards, and way too many strategies for doing things. You might want to use webpack for your project in the beginning, and as the project matures over time, you start to realize that build times are slowing down, and you have to spend hours figuring out which webpack plugins you need for it. And then you listen to someone on Github/X harp on about the wonderous benefits of using TypeScript, and spend even more time figuring out just the right tsconfig and webpack configuration your application needs. And over time, you have to wrangle with evolving Web standards, and outdated/unmaintained webpack plugins. Not to mention, you need to maintain and fine-tune separate configs for your development and production environment as you might want to opt-in for HMR and the like for faster development cycles. Then you might hear about the symphonies sung by the adopters of Vite, Esbuild or any other modern bundlers. And you slowly start to cook up a plan for migrating to one of these bundlers. And amidst all of this, you also have to ensure your code is properly formatted and adheres to a set of defining ESLint rules. You start to add many such rules and forget when something was added and when something was removed. You stare blankly at that annoying squigly red line wondering what the heck Eslint is complaining about now. Why is this component re-rendering multiple times? Why is this chunk of JS file fetched? A new version of some package you are using just released, and it addresses some performance issues. And it turns out they are deprecating a widely used function in favor of a newer function which has an entirely different interface. Maybe it’s time to switch to a different SASS pre-processor. And on and on and on. Frontend tooling evolves at a very fast pace, or I should say “blazingly” fast pace. Frontend development happens at the tip of the cutting edge tooling there is available. It would all be much better if we didn’t jump from one bandwagon to another and just simply wrote code, happy with whatever tooling we had at the moment, content with moving at an enjoyable albeit reasonable pace.