The History of Web Developers Tied to Browser Development

Web developers are the builders of web pages like this one. Consider how we are collaborating here: You, on the reading side, and me, becoming a better writer with the support of an editor from HackerNoon.

Do you see the developers? Probably not, as they did a good job. We are likely to find them reading about the future of web development.

What I offer with this article, on the other hand, is an opportunity to pause and reflect on the emergence of web developers, how that ties to the history of browsers, and how their collaboration has reignited the timeline of browser development.

A new kind of engineer, for the web

+

In the early days of the web, many software engineers did not pay much attention to web development in terms of web pages. Why would they, right? If you were an engineer, would you be impressed by the first passenger coming from the locomotive or the locomotive itself?

Jason Kottke, from the Home of Fine HyperText Products, wrote it well:

Using NCSA Mosaic to surf the World Wide Web for the very first time in the basement physics lab at college was as close to a religious experience as I’ve ever had. It was a thunderbolt that completely changed my life.

But that first impression also allowed hackers (and painters) to approach the subject from the user interface aspect of it. Therefore, the invention and innovation of the Mosaic browser mark the beginning of the opportunities with web development:

Early in 1993, the National Center for Supercomputing Applications (NCSA) at the University of Illinois released a first version of its Mosaic browser. This software ran in the X Window System environment, popular in the research community, and offered friendly window-based interaction. Shortly afterwards the NCSA released versions also for the PC and Macintosh environments. The existence of reliable user-friendly browsers on these popular computers had an immediate impact on the spread of the WWW.

Notice how the browser, as a tool, started to make a lot of sense as the infrastructure behind showed the potential:

On 30 April 1993, CERN made the source code of WorldWideWeb available on a royalty-free basis, making it free software. By late 1993 there were over 500 known web servers, and the WWW accounted for 1% of internet traffic, which seemed a lot in those days (the rest was remote access, e-mail and file transfer).

It was a surreal experience because of that friendly interface that showed the potential to access knowledge from everywhere. Perhaps not different from how I felt when using ChatGPT as a friendly interface that showed the potential to access knowledge from everywhere. Consider reading about the history of Mosaic, and the invention of the Web, in the following article:

View-source: Learn via copying examples

But web pages were quite simple. At the time, we - computer science students - would find smart people by how their pages were simple, like this one from Dennis Ritchie at Bell Labs.

As I was there as a curious user - not attending the computer science lectures and playing with the web - I also stumbled into a menu option, incorporated into the browser, that enabled us to view the source of web pages. And by the way, almost overnight that Mosaic browser was called Netscape.

Jim Nielsen has reflected in The Spirit of View-Source and identified how the Netscape browser had enabled a learning opportunity - instantaneously - for every page on the web.

In his article, he quoted an observation from Clive Thompson in the book Coders

Every single web page you visited contained the code showing you how it was created. The entire internet became a library of how-to guides on programming.

Now, try to picture “the web” as the hottest thing around and imagine how many of us were checking the source of pages to copy ideas from others and try to learn eventually. These were the “view-source days” where we could see the magic.

Although we still have the “view page source” in the menu of modern browsers, if you view the source of a web page, you will likely see something that looks mysterious:

JavaScript: Control and interaction

Another inflection point, well perceived, came about when Netscape (again) enabled JavaScript - the programming language - that allowed web developers to create scripts to control certain aspects of web pages and to have control over the interaction.

Brendan Eich, the inventor of JavaScript and the now-CEO of Brave Software The Browser That Cares about your Privacy, has given us a slide that summarizes the hero’s journey of JavaScript in the land of the Web. His points helps us see that JavaScript was not always seen as elegant but was being heavily used in the end of the day - and continued to improve.

The following screenshot shows an alert box invoked from the Netscape 2 browser interface. Web developers used JavaScript to launch visual alerts (to debug their code) and do impossible things such as control web forms, validate the value of an input form, and other use cases.

Needless to say that a curious user could learn about JavaScript on a page through the “view source.” The HTML page was the envelope that conveyed a great deal of presentation and logical structure about sites through its HTML elements, hyperlinks, images, style, and JavaScript code.

Dynamic HTML: Layout customizations and animation

And another opportunity was enabled through a new tag in HTML named <layer>. Back in the day, around 1997, Netscape launched Netscape Communicator Preview Release with new APIs for developers. According to a press release, “Dynamic HTML is a significant milestone for HTML, providing designers more flexibility and control over Web page layout, while providing users a greater degree of interactivity.”

Later the <layer /> tag became the <div />. The technical innovation at the time had to do with the ability to position a visual piece of HTML, an element, on top of another, as the following 3D illustration shows from one of the earliest DHTML technotes.

For now, you won’t be able to experience the following demonstration from 1997 but try to imagine that train (which was just an image) moving as if it was coming toward you.

The trick consisted of using JavaScript to toggle the visibility of images of different sizes creating an illusion of an animation. The page also launched the sound of a locomotive using some other methods.

At that point, the browser wars at its peak, developers who had started writing pages for Netscape, like me, started to produce pages for Internet Explorer, unlike me. These differences - and the skills required - contributed as reasons for developers to be hired as web developers. The magnitude and complexity of the DHTML movement correlates with the content written by this popular book of 1000+ pages.

Web Standards

A major outcome of the browser wars is that Netscape released its source code as open-source. This is where the name Mozilla appears, as documented in Project Code Rush. That process was strategic, complex, and risky. It was a bold move as acknowledged by the then-CEO Jim Barksdale:

“Well, it’s certainly my hope that the enormous amount of new people that no one company could afford to have working on any product - now contributing to the Netscape Navigator Communicator - will make a significant difference in the improvement of the product. How that works against any competitor, remains to be seen.” Jim Barksdale @ Code Rush 2013 

Aside from the open-source foundation, a key strategy from Mozilla sparked attention of web developers - its Web standards support. To help with that, Netscape has assembled a new team of technology evangelists. Among them, Eric Meyer the CSS guru that attained celebrity status among developers. Their cause resonated with needs of web developers - to end the proprietary differences and have a common ground to implement pages working with all browsers. Eric has celebrated our fight:

“So here’s to Bob Clary, Marcio Galli, Katsuhiko Momoi, Chris Nalls, Tristan Nitot, Arun Ranganathan, Doron Rosenberg, and Susie Wyshak.  We fought the good fight and created a lot of great material, including information about the redesign of DevEdge itself. “

Keep in mind that the above is a small piece of a larger photo. Another part of it was the documentation efforts by Mozilla, which has grown later as Mozilla Developer Network.

Single-Page Applications and the AJAX way

As developers were helping themselves to fix web pages in standards-compliant ways, they were also pushing pages to the limits. These were the days when use cases like Gmail came along, and initiatives like Web Services, have enabled us to consider the idea of single-page applications - what if a web page could work like software applications? The following articles show what the evangelists were writing at the time:

• Accessing Web Services In Netscape 7.1/Mozilla 1.4 Using WSDL Proxying (06 Jun 2003)
• Standards-Based Collapsible Table of Contents Widget (CTOCWidget) (20 May 2003)
• Inner-Browsing: Extending Web Browsing the Navigation Paradigm (16 May 2003)

Despite these efforts, an inflection point came also from the old west. In 2005, Jesse James Garrett from San Francisco, wrote a seminal article entitled "Ajax: A New Approach to Web Applications," Jesse was an user experience designer that impacted web development worldwide. AJAX became a popular term used by developers to convey the intention to add interactivity and create the behavior of web applications.

If you were to hire someone to create a single-page application, you had to hire a web developer that knew AJAX:

The Developer’s Best Friend - Developer Add-on Tools and Page Inspection

The Mozilla project continued the saga, now with Firefox. Firefox carried on the goods of Mozilla and has reached a readiness level in terms of performance, security, and standards support. But the turning point was that it gained the trust of developers not justified by market share but because of built-in tools that helped them to test and troubleshoot pages.

Firebug extension - written by Joe Hewitt that had worked at Netscape - came along in 2006 and helped to build the moment when browser add-ons were increasingly being used to help web developers to debug pages. The usage of Firebug also correlates with rise of the famous jQuery library written by John Resig which was hired by Mozilla in 2007.

Product managers were not unaware that developers were using Firefox to test their pages and deliver faster, even if the main browser, in terms of markeshare, was Internet Explorer. Firefox as a tool to help build pages - used by web developers - was a worldwide phenomenon, better understood if you look at a 2008 presentation from Mozilla contributors Clauber and Mario entitled Firefox - Developer's Best Friend.

On a key slide they stated the importance of using Firefox as a development framework due to its Web standard support and development add-ons for debugging of JavaScript and more.

The rest is history - JS libraries, and frameworks

Now, am I crazy to talk about what is next?

No way. If you are web developer, you might be feeling the heat and the complexity of what you know that has happened. Let’s end this party here with: Browsers have evolved, pages evolved, developers too. And to say that all the players are equally contributing in a fast pace - too fast - to the point that I prefer to look at the past and celebrate.

A few notes are important. One is that I didn’t mention the aspects in terms of server side. It would be difficult to incorporate that reflection with structure, although I acknowlede that web developers branched as front-end, back-end, or fullstack.

Another is that the moment indicated as “Firefox as the Developer’s Best Friend” came in sync with the rise of libraries shipped alongside web pages. A good example is the library jQuery. Therefore, the "jQuery + Firefox as Developer’s Best Friends" days was really a phenomenon where the code of pages started to get complex and demanded more engineering role involved - more bugs in the client side of pages.

That observation would open the door to consider the emergence of libraries like React and, among other subjects, the complex world as indicated by The Great Gaslighting of the JavaScript Era.

The lead image for this article was generated by HackerNoon's AI Image Generator via the prompt "early internet browser".