View Source

I remember seeing this Tom Dale tweet a while back. It's literally about the browser's ability to look at the HTML of the document you're looking at as it first arrived. Now the tweet is stirring up a new round of conversation.

Jonathan Snook has kind of a baby bear take:

We have the ability to inspect the original HTML source along with its interpreted representation. We have the ability to inspect the source of JavaScript and CSS files mapped from its minified and optimized versions. We have the ability to inspect rendering pipelines. We have the ability to stop and step through JavaScript execution line by line.

The increasing complexity of tools doesn’t negate the need for those earlier, simpler tools, though.

The sites some build may be simple static sites, befitting of a simple View Source. The sites some build may be compiled and bundled and requiring tools that allow us to dig deeper. Just because you don’t need those tools doesn’t mean that somebody doesn’t need those tools.

And Chris Heilmann:

For a simple web site with everything in one document or a few linked scripts and stylesheets, that was enough.

I don’t think it is any longer though. Even navigating simple source code of a web site is much more fun in developer tools rather than a huge text block. We can right-click on an element these days and go directly to it. We see how the cascade works when looking at its CSS and we even can see attached events and hover states.

Sure, developer tools are harder to learn than looking at a document, but you also learn so much more from them. The beauty of view-source was that it came for free with a browser. This made it a tool of choice for anyone becoming a web developer. There was no need to download and learn an IDE - your development environment was the consumption environment.

Well, that’s exactly what developer tools are these days. They are free, they come with the browser, and they are not impossible to understand. If anything, I like the fact that they give you more insights into what the code does rather than what it is.

I'll take a hard-line stance, just for fun here: I literally don't care at all about View Source and wouldn't miss it if it was removed from browsers. I live in DevTools, and I'll bet you do too. It entirely supersedes View Source, as you can quite literally view source inside it if you'd like. But that's beside the point.

I don't want my source to be human-readable, not for protective reasons, but because I care about web performance more. I want my website to arrive at light speed on a tiny spec of magical network packet dust and blossom into a complete website. Or do whatever computer science deems is the absolute fastest way to send website data between computers. I'm much more worried about the state of web performance than I am about web education. But even if I was very worried about web education, I don't think it's the network's job to deliver teachability.

The post View Source appeared first on CSS-Tricks.

from CSS-Tricks https://ift.tt/2JO5poM
via IFTTT