Home Designing Websites [Translation] Flush

[Translation] Flush

by admin

Hi Habr, I present to you a translation of the article "To Wash It All Away." By James Mickens.
[Translation] Flush
When I was in grad school in Ann Arbor, I had a friend who was deeply passionate about the environmentalist movement. He bought food from local farmers, rode his bike instead of his car in an effort to reduce emissions, and kept a creepy compost bucket that would probably be the source of the next flu pandemic. One day he told me he was going to live on the farm for a week. I asked why, and he said he wanted to "be closer to the land, " a phrase you can only utter with a serious face when commenting on a documentary about ancient South American tribes. I told my friend that the land didn’t want to be closer to him, and that if he really looked closer to the land, he would see not milk rivers and acidic shores, but hunger, vultures, hard labor with wheelbarrows, and generally unacceptable amounts of insects. He burst into a lengthy lecture on environmental responsibility, which I immediately dismissed because I realized that my naïve friend would give up on that farm, and advised him not to hesitate to return if he suddenly didn’t feel good enough there. He smiled at me the way people in horror movies smile the minute before they meet the axe, and he shoved off.
Exactly 37 hours later he called. I asked how things were going, to which he responded with a long, chilling sound like sirens singing during mating season. I asked him to describe his first day, and he replied that his whole existence revolved around bleating things: bleating goats who wanted to eat, bleating crows who wanted to steal food from bleating goats, and bleating machinery consisting of spinning steel blades with no sensible use other than providing you with a membership in the Prosthetic of the Month Club.
I asked my friend when he was going home, to which he replied that he was calling from the station in Ann Arbor; he was already here. And then he gave out that siren howl again, that creepy, lingering sound, and I knew that THIS IS THE FIRST SYMPTOM OF COMPOSTOVED GRIPP.
IT people often see web pages the way my friend saw farms. People think that web browsers are such elegant computing platforms, and that web pages are such light, fluffy things that you can edit in notepad while exchanging ironic comments with friends in the coffee shop. Nothing could be further from the truth.. The modern web page is a disaster. It is like a scene from one of those apocalyptic medieval paintings depicting the aftermath of the coming of Galactus : people rolling around in a fiery abyss, crushing themselves with various crushing things and dangling from playground equipment that would not pass safety certification. That’s exactly what you’ll see when you look at HTML, CSS and JavaScript in a modern web page. No, of course, no human being is able to really "look" at that content, because the typical web page these days is like the V’Ger from the first Star Trek – a technology we once understood but now can’t even fathom, a crushing leviathan of code and markup written by people so untrustworthy that they are not even a third party here, they are a fifth party, NOT called to this party at all, but showed up anyway because hippies were right and free love or whatever. I’m sure the web browser is one of those "unholy lodges" that Fox News keeps talking about; I would check it out personally by searching the web, but searching the web would require me to use the browser, AND THIS IS EXACTLY WHAT the WHOLE LIBERAL ELITES WANT ME TO DO.
Describing why the Web is terrible is like describing why it’s terrible to drown in an ocean of fugu fish pregnant with little Freddy Kruegers-each detail is nightmarish in itself, but the cumulative sum adds up admirably to an evergreen flower of hate. For example, the World Wide Web Consortium (W3C) provides "official" client-side specifications for many web technologies. Unfortunately, these specifications are binding on browser manufacturers about as much as you can basically ask a jadozub to pick you up at the airport [1] , but yadozub probably has more interesting things to do. Every W3C document is filled with obnoxious sentences, mostly consisting of hyperlinks to hyperlinks. For example, if you are a browser maker and want to add support for HTML selectors, you must remember that in the third step of parsing the selector string "If
result is invalid ([SELECT], Section 12), should throw an exception SYNTAX_ERR ([DOM-LEVEL-3-CORE] , section 1.4) and interrupt this algorithm." Such a romantic sketch in clerical tones will undoubtedly appeal to people pining for the bluntness of the list of ingredients for Doshyrak multiplied by the multilayered bureaucracy of the Soviet Union. Indeed, one can imagine a world in which browser makers hire legions of Talmud interpreters to understand why SYNTAX_ERR exactly orange, not purple, and how exactly this orangeness relates to the ossified purple ([DOM-LEVEL-3-CORE] ). And you can also imagine a world where browser makers don’t do that, implementing instead 53% of every specification, and then hoping that no web page will try to use HTML selectors, then the geolocation interface, and then the <canvasgt tag; because that combo would release the Antichrist and/or display a web page like one of those Picasso works that you supposedly understand, but that everyone secretly wants to throw in the ocean, because no one enjoys seeing an image of a blue man made of isosceles triangles with a guitar growing out of his forehead for no reason at all.


[1] "Jadozubes Will Meet You at the Airport" is the title of a real-life children’s book that had a huge impact on my emotional growth. Her unflinching realism inspired me to write my own series of negatively received children’s books, such as "Spiders Ate Your Sister We Never Talk About, " "Capitalist Advertising Makes You Hate Your Body and Buy Things Made by Slave Labor, " and "I Can Lie and Say I’m Interested in Your Comic Book Collection, or I can tell the truth and explain why you won’t want to date."
Given the unbearable bloat of web standards and the clownishly inarticulate semantics of those standards, browser makers should just spit and advise the public to stop wanting weird stuff. However, this opinion is unpopular because no one will watch your TED talk if your sense of optimism is based on reality. I try time and again to explain to friends why they should abandon web pages and exchange information by means of sunlight reflected off a system of mirrors, well, or vigorously waving colored flags. My friends inevitably respond with a nonsensical set of words like "people invented flying machines, so we can certainly make a good browser!" Unfortunately, the criterion for the success of the flying machine is simple ("I AM THIS I BUT I AM A BIRD"), whereas the criterion for the success of the web browser involves cascading style sheets, a technology which, by its mere existence, dooms any project to a bygone failure. For the uninitiated, cascading style sheets are a kind of cryptography developed by masons to conceal the visual nature of reality and induce people to draw pictures in pseudo-graphics. CSS files supposedly allow you to separate the definition of your content from the definition of how that content looks – using CSS, you can set the placement for your HTML tags and the fonts and color schemes used by those tags. Unfortunately, CSS and HTML go together like the instructions for assembling your bed from IKEA and a set of evil wooden sticks supposedly concealing the structure of the bed. CSS is not so much a description of how your Web page will ultimately look as it is a superficial, high-level overview of what can happen to your page depending on the weather, the stock market situation, and the last time you called your mother. Like a naive gamemaster unspoiled by the sorrows of adulthood, you create abstract CSS classes for <div> and <span> tags, allocating their strengths and weaknesses, and defining the roles they will play in the overarching and sublime narrative of your HTML. Everything is strictly in place; you load the page into your browser and prepare for a glorious victory. However, you soon discover that your tag <elf> is overweight. AN ELF CANNOT BE OVERWEIGHT. Even worse, your <barbarian> tag doesn’t have a big hammer or axe. Without a big hammer or axe, your barbarian is just an ungreedy hunk. And then you look at your tag <mag> and see that it’s not a white old man with a waving beard, but a young Negro from Brooklyn. FOR A MULTITUDE OF COMPLEX REASONS ORIGINATING IN EUROPEAN COLONIAL NARRATIVES, YOUR MAGICIAN MUST BE AN OLD WHITE MAN WITH A WAVING BEARD, NOT A NEGRO WITH HIPSTER SHOES AND A LAVISH RECORD COLLECTION. Such are the troubles that CSS will sow you. Or you will reap. To be honest, I do not know which verb and in what form is more appropriate here, but I am sure that you understand me. Figure 1 shows a concrete example of CSS seeding. Or CSS seeding. MY UNGAINLY STYLE GUIDES ARE FIGHTING FOR MY SOUL.
[Translation] Flush


Figure 1: I once tried to build a cross-browser debugging infrastructure. I had a client-side JavaScript library that could go through a bunch of JavaScript and display funny things about the state of the page. My humanist friends assured me that output to the console was the province of the Neanderthals, so I made an HTML interface to display diagnostic information. The first version of the interface used the default browser layout policies. Much like Icarus, I dreamed of more, so I decided to make an Exaggerated Layout TM I wrote a CSS with instructions on whether my tags should be arranged statically, dynamically, or relative to the zodiac sign. Here’s what I learned : Never specify whether your tags should be statically, dynamically or relative to the zodiac sign As soon as single tag will throw off the shackles of the automatic layout process, the browser will immediately go through the roof and stack random HTML tags in a pile along the Z-axis, an axis that is apparently an acceptable option even if your monitor can only display two dimensions. Eventually I found a working CSS file in a discarded bottle and tweaked it until it worked in my interface. Then I went home, dropping stingy male tears filled with shuriken and turning into lions, barely touching the ground.
If you’re a web developer, CSS is just one of your concerns. The cumulative web technology stack is so fragile that developers have simply resigned themselves to the fact that various parts of a web page will fall off at arbitrary points in time. Apparently, this is the norm because no one takes e-commerce seriously, and if you really crave secure banking, you wouldn’t mind visiting the bank in person, like in the 19th century, instead of using the bank’s Web portal, constantly ( But secretly ) spewing runtime errors into the console log (the console log which the browser doesn’t show you by default, because if you knew about it and listened to its woeful bylines, you would give up computer science and switch to making wooden shoes).
Figure 2 shows an original example of such a console log; the log was generated by a real web page on a popular website.
[Translation] Flush


Figure 2: They said I could be anything, and now I’m logging web browser errors. I have fifteen cats, where are all the parties?

  • The first log entry tells us that the browser rendered the downloaded file as JavaScript, even though the MIME type of the file is text/html. My advice to you: if you do not know what is in front of you, DO NOT do it in the hope to get more information. It’s like noticing that your neighbor is a creepy ragamuffin with running eyes and then starting sleeping on his doorstep, using a rag of chloroform as a pillow, just to make sure he doesn’t tie you to a radiator and make you paint tiny little figures. I’ll tell you how it ends: YOU COLLECT TINY FIGURES.
  • The second and third errors tell us that the page script uses a variable name considered obsolete in strict mode, but acceptable in fancy mode. I don’t even know which end to start this lovely horror-filled bagel with? Humbly : when a man and a woman fall in love, they want to demonstrate their feelings to each other. And so they force browsers to support different execution modes. "Standard mode" refers to the unreliable browser interfaces described in the latest HTML and CSS specifications. "Flashy mode" refers to the unreliable browser interfaces that existed in browsers during the Eisenhower administration. Flamboyant mode was created because a lot of web pages were also created during the Eisenhower administration and the computer industry wanted to keep online rants about how "rock and roll" corrupted our youth. The pretentious mode survived because web developers learned about pretentious mode and used it as an excuse not to learn new tricks. But then web developers also found it, who wanted to learn new tricks, so a standard mode was invented that allowed those developers to walk on the old rake in a new way. And then there’s a third browser mode called "almost standard mode"; this mode is similar to standard mode, except that it displays images inside table cells using the fancy mode algorithm. For reasons eaten by antelope gnu, "almost standard mode" is also called "strict" mode, although it is less strict than standard mode. For reasons monstrous enough to make the gnu antelope refuse to eat them, there is no completely reliable way to make all browsers load a page in the same compatibility mode. That way, even if your page reads all the recommended spellings, the browser can still do what it wants it to do, and in the way that he wants. And this is where children come from.
  • The fourth and seventh errors are raw JavaScript exceptions. In an adequate universe, a single unhandled exception would terminate the program, and if the program continued to run after such an exception occurred, we would realize that Ragnarok had arrived and Odin was out of sorts. In the browser world, on the other hand, ignoring unhandled exceptions is called "Wednesday, and all days that are not ‘Wednesday’". The JavaScript event loop cares little about traditional notions of software reliability, and so if an event handler throws an exception, the event loop will naturally pretend that nothing happened and move on. This horseshit continues even if, as in the case of the seventh error, the web page tries to call init() on an object that has no init() method. You must be uncomfortable with the knowledge that the web page is bifurcated about the presence of initialization procedures, but the page is still allowed to do stuff Such a sharp mismatch between expectations and reality would be unacceptable in any other context. You would be upset if you went to the hospital to have your appendix out and during surgery the surgeon said "I DIDN’T EXPECT THAT YOUR LEAVE WOULD HAVE GIBS" and then proceeded with her original surgical plan, Despite the fact that you appear to be a mermaid The fact that you are a mermaid must have unignorable consequences in the material universe. Similarly, if a web page thinks an object should be initialized, but the object has no initialization method, the browser shouldn’t rant and go on, assuming that the rest of the page doesn’t care if its objects consist of gibberish.

The interpretation of the remaining errors is provided to the reader as an exercise. Note that the eighth error requires coffee grounds, a newt’s eye, and a crystal ball.
It should become intuitive at this point that different browsers may or may not generate the same error log for the same page. In general, if a web page contains more than three bits of entropy, different browsers will generate extravagantly unique combinations of the web developer’s intent and the schizophrenic animal palette the browsers use to convey a picture of the world. So choosing the "best browser" is like playing one of those creepy confidence-building exercises where you decide which three of your five senses you’d rather lose, and then your colleagues berate you for the compromises they had to make, even though there is no partial ordering that can match diving accidents in which you lose your eyes and ears with industrial accidents in which you lose your nose and tongue. All options are bad; it’s a world of trampling. Indeed, trying to choose the best browser is like trying to decide which of your worthless children should inherit the family business. Little Oliver rejects conventional wisdom about what the event loop should do, so whenever the user presses a key on the keyboard, Oliver triggers not one KeyPress event, but three KeyDown events, a KeyUp event, and a cut-out saxophone solo from Mozart’s eighth symphony. The dearest Fiona, a relentless workaholic, designs her browser so that when you "close" it, the GUI disappears, but the main process runs in the background, quietly, viciously and slowly consuming kernel table entries and making it impossible to restart the browser without contemplating the error message "Somewhere in the world another copy of the browser is running; find Carmen San Diego and she will tell you the secret. The beloved Christopher, in an attempt to make his browser fast and easy, decides to replace his Flash plugin with code that prints "Shockwave is down" and then immediately dereferences the null pointer; this ensures that most of your attempts to watch videos will end up wanting more mundane spectacles like woodcarving or cave painting. And poor IE6, aka "it sure as hell won’t do any good because IE6 is not a proper Christian name, " somehow manages to waddle around the world surviving more assassination attempts than Fidel Castro.
Every browser is reckless and quirky in its own way, but all browsers equally share a love of epic paging to disk. Not the occasional rain of miniature I/Os aligned with file system placement boundaries, no, I’m talking about snow storms of read and write collisions, the primal flood that forces you to gather your tribesmen and decide which critters to pair and whether to forget the fire ants, because fire ants ruin summer. Browsers don’t need a specific reason to bump the disk, no; paging is a way of life for browsers, a recreational activity that delivers on its own. If you’re not an IT person, you just accept the fact that visiting CNN.com will make the green flashing light with the cylinder icon stop flashing and glow green all the time. However, if you do know how computers work, then the endless pumping will drive you crazy. It turns you into Torquemada, a pathetic figure possessed by the fear that your whole ideology is just a pretentious lie, needed only to cover up the excessive disk operations of the gray cardinals. You open your task manager, and you find that your browser is running 67 different processes, all called "browser.exe", and they’re all desperately scorching every I/O on mysterious file system areas like "Roamingpots{panscache4$$Dtub.partial" where "4$$" is an exotic ESC sequence that opens into a latvian double umlaut. You search the Internet for potential solutions and come across a bunch of contradictory and unsupported opinions: your browser has a virus; your virus has a virus; you should have used Emacs; you should have used vi, and that is why your marriage failed.
Naturally, the most popular advice for solving of any browser problems is to clear your browser cache. Certainly clearing the cache will sometimes help, in about the same way that kicking a tree by a beggar will sometimes lead to a series of amusing events, culminating in a big bag of money dropping on the ground and a note saying "Spend it all! Tsem, Life." Unfortunately, kicking a tree usually doesn’t lead to riches, so your faith-backed act of aggression toward trees really just makes you a wild, tree-kicking monster, reviled by children and emotionally sensitive adults. Likewise, your sudden purging of your browser cache, despite your good intentions, is just a local painkiller that briefly brightens the agony of being. Fixing your browser by clearing your cache is like your dad giving you a ride to kindergarten, and when the car suddenly starts to smoke, trying to fix it with three slams on the hood, and then asking you if you can still smell carbon monoxide, and you go "yeah, that’s better, " because you don’t want to make your dad look like a crook, and then you both spend the rest of the trip talking, trying really hard not to pass out.
So, yes, it would be great if fixing your browser involved actions that were not semantically equivalent to voodoo. However, on the other hand, it could have been even worse. For example, it would be really awful if your browser’s scripting language combined prototypical Self inheritance, quasi-functionality borrowed from LISP, structured syntax pulled from C, and an aggressively asynchronous I/O model requiring non-trivial callback chains spanning several generations of hardworking Americans. OH NO, I JUST DESCRIBED JAVASCRIPT. What an unfortunate turn of events! Humans craved the combination of Self, LISP and C as desperately as the inhabitants of Middle-earth begged Saruman to cross Orcs with humans to make Uruk-hai. Orcs and humans struggled most beautifully to exist in their separate communities, creating a new race with the flaws of both is not the best way to become the first guy in the village. However, in spite of its flaws, JavaScript did become widespread. Exploring the reasons for this is like trying to understand the causes of the First World War – everyone agrees on the five main reasons, but everyone has a different opinion on their first priority. The bottom line is this: in the 90’s, when JavaScript and Java were competing for supremacy on the client, Java applets were monstrously slow, and could not boast of interacting with HTML; JavaScript was only half monstrously slow and could interact lousy (but could) with HTML. So Java lost, despite :

  • JavaScript is dynamically typed, and its aggressive type conversion rules seem to have been developed by Monty Python. For example, 12 == "12" because the string is cast to a number. It’s a bit dumb, but at least it makes remote sense. Now consider the fact that null == undefined. This is utter nonsense; a reference pointing to null cannot be undefined, it DOES DEFINITELY point to NULL. Now that you’ve warmed up, look here : "rnt" == false. Here’s why : the browser detects that the two operands are of different types, so it converts false to 0 and repeats the comparison. The operands are still of different types (string and number), so the browser converts "rnt" to number 0 because, for some reason, a non-zero number of characters is 0. Voila – 0 equals 0! AWESOME. This explanation is similar to the "Inception" plot, except that the embedded idea was "your program correctness is reduced to false".
  • Hello, good man – let me warm you up on this cold winter night! Did you know that JavaScript defines a special value of NaN ("not a number")? This value is what you get when you do stupid things like ParseInt("BatmanNoNumber"). In other words, NaN is a value that is not a number. However, typeof(NaN) returns… "a number." A more logical return value would be "Hail to VELSEVULU, THE HOLY HELPER OF THE DARKness"" but I digress.
  • By the way, NaN != NaN, so Aristotle was wrong with the whole "law of identity" thing.
  • JavaScript also defines two identity operators (=== and !==) that do not perform the type conversion performed by the standard equality operators; however, NaN !== NaN. In short, don’t use numbers in JavaScript, and if you have no other choice, implement a software ALU. It’s slow but reliable.
  • Not really reliable enough, though. Unlike C++, which uses static descriptions of class interfaces, JavaScript uses prototype inheritance. A prototype is a dynamic object that acts as a template for "instances" of that object. For example, if I wanted to declare a Circle class in JavaScript, I could do something like this :
    //This is a constructor that defines the property "radius"//for new instances.function Circle(radius){this.radius = radius;}//the constructor function contains the object property//named "prototype" that defines additional//attributes of the class instances.Circle.prototype.getDiameter = function(){return 2*this.radius;};var circle = new Circle(2);alert(circle.getDiameter()); //Displays "4".

    The object template for the Circle class is Circle.prototype, and this prototype object is a regular JavaScript object. So, by dynamically changing the properties of this object, I can dynamically change the properties of all instances of this class. YEAH, I’M AWARE OF THAT. For example, at some random point in the execution of my program, I can do this…

    Circle.prototype.getDiameter = function(){return -5;};

    and all my circles will think their diameter is less than nothing. That’s a bottom, but even worse is that prototypes of predefined (or "native") JavaScript objects can also be overridden. So if I do something like.

    Number.prototype.valueOf = function(){return 42;};

    to any a numeric literal packed into a Number object will think it is the answer to the ultimate question of life, the universe, and everything :

    alert((0).valueOf()); //0 should be 0 for all values 0, but it's 42.alert((1).valueOf()); //Zeus help, 1 is also 42.alert((NaN).valueOf()); //NaN is also 42. DECAPITATE AND BURN MY SQUIRMING BODY

    Obviously, I got what I deserved if my JavaScript library overrides its own prototypes by breaking my own code. However, the single frame of the web page contains several JavaScript libraries from several sources, and who knows what horrible prototype manipulations those pagan libraries did before my library ran. This is just one reason why the phrase "JavaScript security" inflames Bibles.

  • Like C, JavaScript uses a semicolon to terminate many kinds of expressions. However, in JavaScript, if you forget a semicolon, the JavaScript parser can automatically insert a semicolon where it thinks those semicolons probably should have been. This seems quite useful, until you realize that the semantic meaning of the semicolon You can’t just throw them around like you’re Johnny Appleseed from punctuation. Automatically inserting semicolons into your source code is like playing a game of spoiled phone, as long as every lost word is replaced with the phrase "fuck you." It’s a great way to refresh your interpersonal relationships, but it’s not the best way to parse code. Some JavaScript libraries deliberately start with a semicolon, to make sure that if that library was suddenly added to another (e.g. to reduce the number of HTTP requests when loading), the JavaScript parser would not try to glue the last statement from the first library and the first statement from the second into some orgy of statements with a semicolon as the toast. Such an initial semicolon is called a guard semicolon. This is the saddest programming pattern I’ve ever heard of, and that’s even though I’m pretty good at C++.

I could speculate endlessly about the reasons why JavaScript is a cancer brought down on this world. I know there are people who love JavaScript, and I hope those people get the psychiatric help they so desperately need. I don’t know all the answers in life, but I know all the things that are not those answers, and JavaScript falls into the same category as Scientology, homeopathy, and putting tiny sweaters on dogs because of the mistaken belief that this is what dogs would do if they had access to looms and thumbs.
To summarize, web browsers are like quantum physics: at best they offer probabilistic guarantees, and anyone who claims to fully understand them is a liar. At this stage of human development, there are more pressing problems: climate change, heart disease, the bad financial situation of Nigerian princes wanting to contact you personally. Since all of these problems have not been solved, web browsing is terrible way to pass the time; running unstable operating systems written for fun and loading weird JavaScript files from strangers is latest what we should be doing. Instead, we should be exchanging information using fixed-length ASCII messages written in a statically verifiable subset of Latin, with images represented as mathematical combinations of line segments, arcs, and other eternal forms described by dead philosophers who believed that minotaurs existed but were unable to get out of mazes. It is this kind of clear thinking that will help us defeat the Space Egyptians coming out of the Stargate. Or whatever. I’m an American and not strong in history, but I firmly believe that the Greeks spoke Latin to defeat the intergalactic Egyptians. #DoPolemics! In short, my point is that browsers are too complicated to be trusted. Unfortunately, the kids are wasting their youth, and the current generation of software developers is convinced that browsers need more features, not fewer. So we are invited to rejoice that browsers are turning our computers into little Star Wars taverns where everyone is welcome and where you can have a blue drink if you feel like having a blue drink and if something goes wrong, maybe a Jedi will save you, and if not, THIS IS THE STAR WARS TAVERN, YEAH. Space taverns are good, but this is sci-fi; it’s just a bunch of ridiculous details stitched together to amuse the public. Open your eyes and behold, in the real, non-hyperbolic world you live in, your browser will interrupt the video now and then, and then show flashing epileptic pixels, making the same sound that TV sets in Japanese horror movies make before the pale child comes off the screen and robs you of your warranty. It could actually happen, and we should wash it all away.

You may also like