It has been a little over a decade since that April when a letter from Steve Jobs announced the refusal to include Flash in the iOS platform, which would lead to the decline of Flash, a platform that, for many, was then the most advanced and versatile in the context of web development.
I do not intend to relive in this article the timeless discussions about the benefits and problems presented by that technology at the time. You know, great power comes with great responsibility. There is nothing new under the sun.
What I intend to analyse and put into perspective is the change that has resulted from the fact that the main actors of the web ecosystem decided to shift their course towards other technologies. A change that, in my view, was based on arguments that had little to do with what truly motivated those decisions.
Returning to the topic, let us briefly discuss the impact that change has had on web development professionals at many different levels, including technologies and languages, new browser APIs, philosophies, development strategies and paradigms, frameworks and libraries, code editors, online publishing tools and services, automation, etc.
The first and most obvious consequence of all involving a change like the one being initiated at the time was that the chosen alternative had to offer the same while trying not to take a step back in that process. The alternative chosen was web standards, and time has shown that the road has not been as easy as they wanted to sell to us.
The change was big, and whether you suffered it or enjoyed it, or if you didn’t experience it because you’ve been in this for less time, it is good not to lose sight of the story that has brought us to where we are today.
Interesting, isn’t it? So let us get started!
HTML5, CSS3, Canvas, WebGL, SVG…
Web standards were chosen as an alternative, but the reality is that there was still a lot of work to be done in many areas to maintain the level of online experiences to which users were already accustomed.
Those of us old enough to have experienced this change will certainly remember that things as “trivial” today as centring an item on the screen were anything but easy in 2010, since the Flexible Box Layout, which seems even “old” today, was implemented in browsers for the first time around 2012.
A significant improvement was needed in the specifications and capabilities that formed the basis of this new path; thus, we have been experiencing the emergence of HTML5 and CSS3: the former modernising and improving semantic tag options, and the latter providing coverage for a myriad of visual needs that were complex or even impossible to implement without the use of JavaScript.
Speaking of HTML, we must refer to Canvas for working with graphics from JavaScript. The inclusion of audio and video elements allows us to work with these formats without the need for third-party plugins. Picture and source tags facilitate working with multi-device images, and the WebGL API enables us to work with 3D content through scripting. These are some of the “direct” lacks that have had to be overcome to avoid going back in time.
On the other hand, CSS3 was a turning point in browsers’ ability to address specific requirements, with a paradigm shift in the specification based on independent modules such as box model control, variable typography, advanced background and edge management, text effects, 2D and 3D transformations, animations and advanced layouts with media queries, multiple columns, flexbox and, more recently, functionalities as important as grid, variables, selector improvements (has, is and nesting), container queries, cascade layers, many new units, support for new colour systems…
This improvement in languages has generated a pattern that Eric Meyer (one of the world’s most relevant voices regarding web standards) called “Declining complexity” in 2017. Although he applied the concept to CSS, I believe it can also be applied to the other two aspects of the standards that govern the web today: HTML and JavaScript.
He intended to state that incorporating language capabilities to simplify tasks that were impossible before implies growth, which does not necessarily have to be synonymous with complexity.
The image of the evolution of CSS in recent times that appeared in the original tweet is etched in my mind. It clearly showed that the latest edition of his book, CSS The Definitive Guide, was the same extension as the two previous editions combined.
The same has happened with SVG technology. We can find books of more than 300 pages dedicated exclusively to something seemingly as simple as an image file format, or even books about specific techniques for its use that are over 200 pages long.
JavaScript
JavaScript has not only had to accompany those new features (such as Canvas, WebGL, audio, video, etc.), but has also needed to improve as a language and simplify many tasks.
The language had barely evolved since 1999, but a turning point came with the advent of ECMAScript 6 (also known as ES6 or ECMAScript 2015, as it was published in June 2015). This significant update included many expected functionalities in ECMAScript 4 – which never saw the light of day.
This version, in addition to taking a giant leap to improve the work with the language, also signifies a new working dynamic in the standard, with annual periodic versions through which language improvements are continuously introduced. This is absolutely necessary if one wishes to keep pace with current technological advances and user demands (devices, hardware, software, sensors, capabilities…).
We cannot detail everything JavaScript has improved in these years, but simply looking at the list of new supported APIs – Fetch, Web Components, Web Workers, Storage, File, Push, Clipboard, History, Keyboard, Gamepad, Geolocation, Canvas, WebGL, WebRTC, GraphQL – can give us an idea of the scale of the change.
At this point, I should also mention TypeScript, a language introduced by Microsoft in 2012 that is typed and transpiled into JavaScript. It has acquired considerable notoriety in frontend development, offering some very interesting advantages depending on the type of project and being adopted by almost all the main frameworks today.
And we are just halfway through.
We must also mention that node.js entered our world in 2009 and completely changed it. Thanks to the possibilities offered by the JavaScript V8 engine, it ran JavaScript outside the browser (mainly on the server), marking another turning point at many levels.
Browsers
Everything we have seen cannot be used unless browsers consistently and uniformly provide the necessary support for the new technologies.
Throughout my career, I have often been asked why technologies like Flash or libraries like jQuery were so successful. It was always clear to me. All of them were born to solve one of the significant problems in web development: browser inconsistency, both in terms of gaps in support for certain content and in terms of the differences they generated when implementing said support.
When I talk about support, I not only want to refer to browsers being able to show those improvements but also to provide tools that enable a better development experience. In my opinion, this is entirely necessary to address the current needs and level of professionalization.
Fortunately, the developer tools that the major browsers (Chrome, Safari and Firefox) have been incorporating and improving are vital in addressing the current complexity and professionalization existing in web development.
In this sense, I believe we are in one of the best times for web development. However, we are not exempt from some inconsistencies and support gaps that might hardly be completely resolved as long as browsers belong to companies (in many cases, very powerful ones) with their own interests and objectives.
On development philosophies, strategies and paradigms
I must recognize that it has been difficult for me to think of a heading for this section because, here, I intend to include aspects that are not as tangible as those seen so far.
The world has changed, and it continues to do so very quickly, and technology has been one of the primary triggers of those changes. Furthermore, all this is happening on the Internet, and as professionals who work in and for that medium, we are completely affected by it.
We have gone from designing and developing for an almost unique resolution to having to consider a myriad of resolutions for our projects to come to life. We have gone from slow connections to facing all types of connections. From working with a server to retrieving our content from many specialized services, such as CDNs. From displaying virtually static content to providing real-time information with notifications, constant data queries, etc.
All of this has led us to rethink many things that were once easier in nature, and required new development philosophies to be put on the table, architectures and paradigms such as the renowned Responsive Web Design in 2010, by Ethan Marcotte, Mobile First in 2009 by the great Luke Wroblewski who would later become a book, Harry Roberts’ ITCSS in 2016 (very aligned with the new CSS cascade layers>) and a multitude of development strategies such as: Single Page Applications (SPAs), Server Side Rendering (SSR), Static Sites Generators (SSGs), Progressive Web Applications (PWAs), Jamstack architecture, etc.
There are endless possibilities (not necessarily excluding) when addressing our projects, with their pros and cons, which have brought us a multitude of development frameworks, such as the ubiquitous Angular, React and Vue.
Tools and Services
We could not ignore the tools because they are key pieces in this section beyond the browsers we have already mentioned.
Here we have a multi-headed monster whose growth and advancement has, on several occasions, changed the way we develop our projects, because we are not only talking about code editors (possibly led today by Visual Studio Code), but we also have to cover a multitude of tools that are, and have been, key on this path (many of them around the ecosystem created by node.js):
- Platforms such as Github, GitLab, Bitbucket for collaborative development and code versioning.
- Package managers such as npm or yarn.
- CSS preprocessors such as Sass and LESS or tools such as PostCSS.
- Linters, especially for JS such as JSLint, ESLint or JSHint.
- Task runners like Grunt and Gulp.
- Build systems like WebPack, ESbuild, Vite…
- DevOps and continuous deployment tools with platforms like Docker, Kubernetes, and cloud services like Amazon AWS, Azure or Google Cloud.
- Services for Jamstack projects that amazingly simplify some tasks in developing and publishing, such as Netlify and Vercel.
- Platforms specific for different types of projects such as Shopify, Squarespace…
And I would still have many fronts to address, such as optimization tools, new compression protocols, or the influx of AI into many of these tools to go one step further, as is the case with the assistant Copilot for code writing or the craze with generative AI in the field of content creation.
What now?
Looking back on everything that has happened in web development, I experience a mixture of wonder, excitement and distress.
Wonder for the speed at which everything is happening. Excitement for the new possibilities that lay ahead. And distress because I cannot deny that it involves, at least in my case, a factor of anxiety and fatigue.
Fortunately, I am among those who believe that the key to success lies not in technology or tools (although I have always advocated that they are essential and have a significant impact on our work) but in the people, ideas, and strength of the messages we can direct towards the fundamentals that drive humans (especially as the evolution in user experience knowledge and study has increased significantly in recent years).
Now, I just have to look around to see that most of the talented creatives, designers, and developers who succeeded with Flash continue to succeed (and even more) after surviving this hurricane that our profession has become.
It should mean something.
References / Related Links
https://en.wikipedia.org/wiki/Thoughts_on_Flash
https://caniuse.com/?search=flex
https://meyerweb.com/eric/thoughts/2017/11/14/declining-complexity-in-css/
https://medium.com/codeburst/declining-complexity-in-css-ca65c4d606e4
https://www.oreilly.com/library/view/css-the-definitive/9781098117603/
https://en.wikipedia.org/wiki/ECMAScript_version_history
https://developer.mozilla.org/en-US/docs/Web/API
https://developer.chrome.com/docs/devtools?hl=es-419
https://developer.apple.com/safari/tools/
https://alistapart.com/article/responsive-web-design/
https://www.lukew.com/ff/entry.asp?933
https://www.lukew.com/resources/mobile_first.asp
https://csswizardry.com/2018/11/itcss-and-skillshare/
https://es.wikipedia.org/wiki/Single-page_application
https://en.wikipedia.org/wiki/Server-side_scripting#Server-side_rendering
https://en.wikipedia.org/wiki/Static_site_generator
https://en.wikipedia.org/wiki/Jamstack
Recommended citation: GONZÁLEZ SANCHO, Juan Marcos. Back to the future. Mosaic [online], December 2024, no. 202. ISSN: 1696-3296. DOI: https://doi.org/10.7238/m.n202.2408
Deja un comentario