Is modern front-end overcomplicated?

23Responses

Write your response…

This answer has received 8 appreciations.

Honestly, I've been thinking this for a while now. I was looking at a React project recently and all that went into it and thought to myself "I think we've gone too far." There was a nice balance about 2-3 years ago but I feel like the last 2 or so years have literally been a game of one upsmanship as to who has the best and hippest tech stack.

Personally, I blame the larger tech firms like Facebook and Google for pushing new proprietary ways of doing things instead of pushing and expanding the standards. Go, JSX, etc might be cool but they seem to exist to answer problems that could be better solved by working to push better open standards like Web Components instead of spinning off on their own direction.

Worse, is now you've got generally stable companies Microsoft getting into the game with .NET 5, I mean DNX, I mean DotNet, I mean .NET Core and even though it's close to release, it's an absolute mess full of shims and missing libraries and work arounds.

Innovation is great. Innovation for innovation's sake is just foolish.

</rant>

It's been a long all nighter debugging this MERN project I inherited.

Write a reply...

This answer has received 5 appreciations.

Q: Why is frontend development complicated?

A: Because we make it complicated!

I've been observing this current 'trend cycle' in web development with shock and horror.

Never in history has it been easier to sit down and write plain HTML, CSS, and JavaScript! Those are the three core pillars of the web as a platform - and it feels that instead of trying to get as close and familiar as we can with those three technologies, so many people are caught in the endless attempt to abstract away the web part of the web platform and approach it as a software development platform, almost ignoring what makes the web platform unique and powerful.

People use Babel for their JavaScript; SASS, SCSS, Stylus, and PostCSS for their CSS; and Jade/Pug and other HTML shorthands for writing their HTML. They use modules upon modules upon modules, building an intricate web of dependencies. The NPM left-pad fiasco should demonstrate how fragile the ecosystem and workflows people have been using are right now.

At the end of the day, the resulting websites coming out of these workflows are rendered as plain HTML, CSS, and JavaScript - I wonder how often it's easier just to write that output directly yourself instead of using all the other tools and workflows to conjure up the simple result we want to see at the end. (Once you've been solving the same problems for a while you would end up with a snippet-based workflow instead of a tool-based workflow)

The other danger I see in using too many tools to build websites instead of writing HTML, CSS, and JavaScript in a more direct way ➸ every tool is an imperfect abstraction of the idea you're working with. For example you can be more expressive in CSS than the code that CSS tools will work with and allow you use. If you use a linter, or other tools to help tidy up your code, they will often be stricter than the full range of expression the language allows. When you use multiple tools together, you become limited to only being able to express the parts of the language that all of the tools have overlapping support! If you use a lot of tools you're giving up a lot of freedom and flexibility, and this often leads to headaches and creating a lot of unnecessary labour for yourself. It's kind of like dividing by zero: as you're limited in expression in your whole project (with all tools) by the least expressive tool you have in your workflow.

Another way to think about it - every layer of abstraction away you are from your final output is like wearing an additional pair of sunglasses. If you wear 3 or 5 pairs of sunglasses pretty soon it will be too dark to anything clearly at all.

I really like the answer and, indeed, the 3 pillars of the Web should be used and written directly as much as possible, however, people are trying to mix it all together and everyone does it in own way, thus all the problems. Tim Berners-Lee understood the importance of Web Standards many years ago and founded W3C. If, instead, of writing another tool, people could just more actively contribute to Web Standards, life would be easier.

However, the problem of the Internet is the requirement to support many devices and, of course, there will be browsers/platforms which does not supporting something, at least temporary. I am not against Babel and CSSNext, these tools are not required, but if you need to support older platforms or to start using something that is available only in Chrome/Firefox under the flag or not available anywhere yet - then you just need to transform your code. Build process existed long before modern framework wars. At that time you just concatenated multiple CSS files into one and minified it. Now, you just have 1 step before. The main problem, indeed, is with people who are "inventing" nothing and just don't want to learn and use the 3 Mighty Pillars of The Web.

I already have BunnyJS and Assets Builder which are making life easier. Just oldschool import/install and you can use it. Don't need to set up any build tools, don't need to learn, install, configure huge frameworks when you just need a component/widget in your app.

At the end it all depends on us. People are making their life complicated themselves and later are blaming others for so.

Write a reply...

This answer has received 5 appreciations.

My answer is yes. It's overcomplicated.

Web front-end developer create programs for a most popular environment - browser, because browser capabilities and API's are growing extremly fast and it's great.

But let's take a look inside browser. Browser has several separate knowledge areas: html ,css, javascript, dom, bom, data transport, specifications, implementations, tooling. Also you should work with this areas for several platforms: Windows, OS X, Linux, iOS, Android, Windows Mobile, TV. Also you should remember, for example, behavioirs for several render mode: default, transcoder, webview, standalone, quirks mode. Apply this on modern browsers - IE, Opera, Chrome, Firefox, Safari and you will get complex and extremly fast changing eco-system of code.

Just a moment, I forgot to add user experience, accessibility, testing, seo, design, usability, performance, semantics, progressive enhancement , graceful degradation, cvs, cli, ssh, package manager, security, build, livereload, pipes, data formats, fonts, graphics, gpu, open gl, sql, networks, tcp/ip, http, spdy, gzip, deflate, base64, mvp, mvc, mvvc, reactive programming, functional programming, object oriented programming, screen sizes, orientation, jit, ast, llvm, dns, workers, fps, regexp, csrf, clickjacking, bots, pc devices, android app, ios sandbox, nginx, crypto to front-end developer stack. And of course compatibility and bugs of all this things too. And only front-end developer with a huge base of knowlege and experience can look forward without fear.

And of course, it will be always overcomplicated. Frameworks just resolve some problems with capability and data stucture.

P.S. I don't know about .Net eco-system, but in Java in 2008 I have to write 25 variants of the game for most popular phone vendors - Motorolla, Siemens and so on. And of course I had to kept in mind a lot of thinigs, because java was a most popular environment...

Write a reply...

This answer has received 1 appreciation.

I will be the devil's advocate on this one. While I agree that things have definitely got out of hand in front-end dev, these days, I also think it comes down to how you implement your stack.

For example, if you just use React/Redux and something like Babel for transpiring, this is still a fairly simple stack.

However , what kills me is when developers then tack on a plugin/library/dependency for every problem they have in their app. Form validation, routing, formatting, responsive, AJAX, etc, etc.

I think if we stick as closely to the core of the stacks we choose to employ, then this becomes manageable. You may have to do more work, but there is less to keep track of and fewer opportunities for random changes to a package wrecking your project.

Write a reply...

I believe that there are a lot of choices when it comes to front end development and that makes it hard for us to focus on 20 things at a time. We are not supposed to know every possible thing there is in web development but it would be cool if we can gather more information and use it. Same applies for life in general.

As we all know, web development as an industry grows more and more each day and people are trying to solve their development problems with new tools, frameworks, libraries, technologies etc. so they release a new tool they think it would be cool for others to check out and use but that adds another tool to use in your every day life. Yeah it will cut down on development time but it will increase the complexity of your project by x2 times.

That means, now people have to learn yet another tool, and spend extra time to use it. That ends up with people being way too spread around and now when you need people who strictly know only a few tools, the exact stack you use, you can't find them, because they are exploring the world of front end development and spending time learning new stuff while never master one thing from that stack.

Don't get me wrong, I love to experiment with different tools and technologies but for some projects, that might be an overkill.

People have to somehow limit their stack to a few tools, they can't work with more than 10 things at a time. It's great if you can use like 20-30 tools at the same time but it will drain your energy fast. It really depends what you are building though.

Here's a fun video to check out [from this point up to the 20th minute], he's talking about general web development but it still applies for front end development.

Write a reply...

Load more responses

Join a friendly and inclusive Q&A network for coders

  • 🖥Pick the technologies you like & read great content through your feed.
  • 💬Ask a question when you want to learn more about anything.
  • 🚀Share what you know & build your portfolio.
Sign up nowLearn more

loading ...