Simplicity vs Functionality: hello Web 3.0

Warning: rant incoming

How was that frontend hackathon? Awesome! We almost installed and configured webpack and babel

— a reddit user who I instantly related to ;_;

Remember the days when all people could talk about were glossy buttons and CSS3 effects? Or when libraries like mootools were popular and you could make the coolest menus with them?

I think back to those days and (I admit, I was young and really had no clue when it came to web development, but) the thing I remember the most is the aesthetic. The flashy blinking things. The fancy slide out menus. The tacky but charming, over the top hovers. It was a simple time, and although we didn’t have the task runners or package managers we do today, the more I work in this industry, the more I feel the difference in the end result. In my humble opinion and from a front-end perspective, I feel like developers back then were so much more invested in not just the journey but also the end-result, aesthetically speaking. The obvious reason for this is because back then the web developers were the web designers. Offshoots had to form for front-end, back end, UI etc. because no one can know it all these days when it comes to websites, let alone design when we now have accepted web standards. But now we have bloated frameworks, dependencies on dependencies, and using so far abstracted code people learning CSS in the next 5 years might just start learning it IN JS. Crazy times.

I never¬†thought of myself as a developer until a year ago- always, firstly, a designer. To be completely real, it’s actually pretty hard for me to even identify as a developer today, simply because there are now so many standards, expectations, and noise that says I’m not, really. To break down why, here’s a few reasons:

  1. I develop themes using WordPress, which is apparently old news because it’s bloated with plugins and security issues.
  2. Then there’s jQuery, which is also apparently on it’s way out because apparently es6 and fetch is all you need
  3. And then there’s webpack, which I thought might help my build process but instead I feel like it wasted hours of my time reading about it because they just do not explain themselves properly, likely because they assume everyone knows what they’re talking about because it’s so popular
  4. People not really taking me seriously because I like keeping things simple…..this is more of a personal thing but sometimes I feel like I have to work 200% harder to be taken seriously

Don’t get me wrong, I love coding. I love being a part of a community that wants to do better. And I love the interactivity of the end result. I’m just frustrated because I feel like a lot of developers today have a warped sense of simplicity, but through all the noise and egos and buzzwords and opinions on the internet you can’t help but compare yourself to what everyone else is doing and wonder how you stack up.

There’s so much noise, and so many frameworks, and modules even to choose from. Just hours ago, I was trying to decide what module out of ~10 to choose from to do one single thing I thought would be easy, all of which were named fairly similarly and did pretty much the exact same thing. It’s ridiculous. It’s annoying, and there’s got to be a point in time where you have to weight the chose of time vs. the cost of the build process. It’s hard to know what to do because it literally feels like everyone has their own opinion on the actual best way to create a website, or web app even. I understand the need for things like CSS in JS and the use-case for react. Specifically if you’re working in a large team, enterprise level, totally get it. I’m really looking forward to Gutenberg and I think it’ll definitely be a game-changer in the sense that it’ll make or break WordPress in the long run. I’m really hoping it’ll work for WP though because I do still think is a solid foundation for a website today. I’m interested to see how react works with WordPress though- I’ve been wanting to experiment with react/vue for a long time now, but I am only one person and there are only so many hours in one day!

The whole reason I started this rant is because earlier I was trying to configure webpack for a static site side project I’m working on.

Sidenote: I will blog about it in a separate post soon – it’s almost finished and I can’t wait to properly introduce it! I based my build off the Victor Hugo boilerplate and have been customising it for my needs. It’s the first static site I’ve made and honestly it’s really swayed me over to the SSG/headless CMS movement. I was always a firm believer in WordPress but after using Hugo I truly believe SSGs have potential to take a huge majority share from WP. Seriously. I’ll blog about it more in my next, more coherent post though.

So anyway back to my rant. I was trying to configure webpack. Then I realised it doesn’t support entry points from multiple files out of the box. Hence looking for a fix. Turned into hours of reading dumb comment threads. Then I realised the file I was trying to configure was using ES6. And something in the transpiler wasn’t working properly because I was getting an unexpected token error. Which made me faff around a bit looking for clues, then I just thought, how logical is it really to use code that hasn’t even been implemented yet?!?

I get that you can get away with not loading jQuery now if you’re using ES6. I get there are cool new features and arrow functions. But when you get errors like these, which are so hard to debug, is it really worth going to all this trouble to use it in the first place? I’m not a 100% JS developer so what would I know……………………but in a similar vein there is also postCSS/cssnext which was included in Victor Hugo, which is not really intuitive or useful in my opinion because literally what’s the point? I’d rather wait until the features are fully rolled out in browsers because I value my time and sanity. Saying the code is future proof is not really a selling point when the overhead far outweighs the benefits.

My point is, I just don’t understand why developers like over complicating things and reinvent the wheel. Imagine looking at all this legacy code in the next 5-10 years. What’s going to survive? Vanilla everything. What’s going to happen if a website changes owners or gets passed to another developer? Didn’t see that coming did you?

I think devs forget build processes have the ability to significantly affect how a website is generated in the first place and in 5-10 years from now, I can imagine devs will either have to make heads/tails of it, reverse engineer the build process or remake the site from scratch. When you have a website running of hundreds of dependencies and transpilers, package managers, processors….it all gets a bit much. When they become deprecated…good luck trying to figure that out. And when frameworks/libraries fall out of favour you’re pretty much on your own. I have a soft spot for jquery because it’s syntax is perfection IMO. But it’s anyone’s guess as to what will die and what will become popular in even the next few months. I want things to be simpler. But how can things be simpler when everyone else is saying MOOORE TRANSPILERS LESS JQUERY. Ughhhh.

2 thoughts on “Simplicity vs Functionality: hello Web 3.0

  1. Anon says:

    JavaScript __is__ ES6 – or rather, an implementation of it. No need to shy away from it if you are OK with JS. Transpilation to polyfill features like arrow functions is only needed to support outdated browsers. Or if you are using a language like TypeScript which is not supported in the browser.

    All these tasks etc just to get some colours and effects on a web page… When often times the same can be achieved with regular HTML and CSS. It’s insanity. And making 5 or more requests to the server to fetch data for some tiny element somewhere… Madness.

    And then as you say, there are these JS frameworks, they will be the end of us all. The JS ecosystem is doomed. We are building unmaintainable shit and everyone thinks it’s the coolest thing ever.

    Then there’s WebAssembly. It has the potential to fix the mess we got ourselves in with JS, but who knows if it will get picked up by the masses.

    Honestly I think in many cases, no JS is best for the web. Server side rendering, HTML, and CSS ftw.

    1. Jakki says:

      Sorry for the late reply but I just saw this – I turned off all my email notifications due to spam. :sweat:

      The JS ecosystem is really confusing and messy imo – I do think there are some valid libraries and tools out there but there’s so much noise of what’s good/not it’s hard to discern as an individual what to invest time in and what will actually be worthwhile to know in the future. Also in regards to ES6 etc. I think they have gone about it very weirdly and have made it all SUPER confusing, because right now there’s so many different styles and syntax out there like between ES5 and ES6. I don’t write a lot of JS every day, but when I do it’s just often hard for me to to understand what feature belongs to which spec etc.

      Unfortunately websites are only getting bigger and more animated especially since clients now expect websites to perform as well as “apps” on phones and have the same interactions and animations. So designs and code have to keep up with that, and things like React seemingly make content load faster. I’m not sure how accurate that actually is btw, but the fact that people are calling react the next evolution of web development is a huge call and something that I take pretty seriously, even though I believe and always have believed that simple text and effects is better.

      But, that is just my opinion, and I’m sure someone with a lot more experience in the areas of SPA’s will know better than me the benefits of using these tools.

Leave a Reply

Your email address will not be published. Required fields are marked *

x_x o__O c: ^v^ ^m^ ^_^ ^]^ XD T__T T_T C: B) >x< >_> >_< >V< >D> >.< ;_; ;) :} :| :zz: :yey: :yay: :x_X: :x :wink: :wink2: :uhh: :tv: :tocry: :to>.<: :sweat: :squee: :sleepy: :sigh: :shocked: :sad: :riun: :risweat: :risad: :riok: :riluv: :riluv2: :rik: :rihm: :rihappy: :riface: :rieh: :ricute: :ok: :o_O: :o_O :o-o: :o :num: :nod: :mwa: :mew: :lurv: :love: :lol: :kozz: :koluv: :koha: :koface: :kissy: :ki: :hmm: :hello: :heh: :hee: :hearts: :heart: :gah: :flower: :drink: :cloud: :cake: :burger: :boo: :bolt: :berry: :bell: :bee: :aww: :argh: :[ :XD: :WHAT: :S :P :O__O: :O_O: :K :D :< ::|: ::o: ::D: ::/ :3: :333 :3 :0 :/ :...: :* :) :( :# .__. ._.