JavaScript
This article is a stub. You can help the IndieWeb wiki by expanding it.
JavaScript (JS) is a programming language used for progressive enhancement on IndieWeb sites, sometimes in web servers running [[node.js], and unfortunately also abused for fragile [[js;dr] sites that fail in various conditions like poor connectivity or being archived by the Internet Archive.
Libraries
Generally useful libraries being developed by IndieWeb participants that run in Javascript:
- CASSIS
- Various Node.js Libraries available on npm
- ...
Criticism
Sites break without Javascript
Javascript seems to have engendered web development methodologies that depend on it. Many sites seem to break without it, become inaccessible.
- http://sighjavascript.tumblr.com/ provides examples of sites that do poorly without javascript
Although it is unlikely that visitors of your site still use a browser that does not support javascript as a technology, there are situations in which this is relevant to you as a webmaster.
- A search engine crawler indexes your site: they may not index text content unless it is accessible without javascript.
- Google's crawler runs at least some javascript these days.
- HOWEVER, as of 2014-10-27 Google still says Make sure your web design adheres to the principles of progressive enhancement
- A visitor of your website uses a javascript blocker like noscript, which people sometimes do to avoid directly consuming proprietary software.
- A visitor to your site is using an older browser with an incompatible implementation of javascript. Rather than shimming your code to work with these browsers, you can just make your site work without JS. See: Cutting the Mustard
- Maybe we could tone down the JavaScript on eev.ee has an exhaustive list of situations in which javascript may be unavailable or a site visitor’s experience may be hampered by javascript
See also: antipatterns
More Fragile Than HTML
Many sites now depend on Javascript to generate the page in a browser, rather than generating the page on the server and sending HTML. This is a more fragile approach:
Breaks Browser User Features
JS breaks links in new tab
As illustrated by: https://twitter.com/gabrielgironda/status/721115498474270721
DEAR #FRONTEND DEVELOPERS: PLEASE STOP MAKING SITES WITH LINKS I CAN'T COMMAND-CLICK TO OPEN IN A NEW TAB. WHAT IS WRONG WITH YOU
JS breaks form submission UI
As described by “Modern” web design antipatterns:
I press Enter, and nothing happens. So I click the submit button – which is, as it turns out, a <div> with attached JavaScript. That JavaScript changes the <div> text to “please wait…” and then it sends off an asynchronous API request. When it gets the response from the server, it then changes the location URL in my browser.
Congratulations on reimplementing <form> the long way around!
Ibid:
I clicked on it, and tried typing “wa” – and nothing worked. It didn’t jump down to “Washington.” It didn’t even jump to “Washington” then back to “Alaska.” Oh, and of course cursor keys didn’t work either – I had to use my mouse to scroll and click and this hurts my wrist and is slow and error-prone. […]
Because it turns out that the dropdown box, rather than being a <select>, was a fucking <div> with JavaScript to set the value. And doesn’t have any keyboard access. For bonus points, they invented some HTML tags like <dropdown> to contain it. Why?! Standards exist for a reason!
Can Encourage Bad Engineering
As summarized by: https://twitter.com/fox/status/716879915333750784
I have seen the worst engineering in my career lately and I have one message:
STOP TRYING TO WRITE EVERYTHING FRONT-END IN JAVASCRIPT
Instead: Use JavaScript only for progressive enhancement.
See Also
- Category:Software:JavaScript
- JSON
- jQuery
- CASSIS
- languages
- Node
- js;dr
- JSBin hosting challenges: https://remysharp.com/2015/09/14/jsbin-toxic-part-1
- 2018-03-31 Criticism (of JS-centrism among other things) Dear Developer, The Web Isn't About You
- 2019-01-21 Chris Coyier: The Great Divide / Two front-end developers are sitting at a bar. They have nothing to talk about.
- https://github.com/patrickhulce/third-party-web
- Criticism: 2017-02-05 All JavaScript frameworks are terrible on Angular, Angular 2, Aurelia, [[React], Ember, Vue, Meteor JS
- Criticism: 2017-02-21 The JavaScript phenomenon is a mass psychosis
- Criticism: 2016-10-03 How it feels to learn JavaScript in 2016 - a dialog illustrating the absurdity of complex JS toolchains with React, JSX, Babel, AMD, CommonJS, Browserify, Angular, VueJS, Grunt, Gulp, Broccoli, Mimosa, Webpack, SystemJS, Typescript, Flow, etc.
- toolchain
- Criticism comic - overuse thereof: https://twitter.com/CommitStrip/status/1119222651673878530
- "It’s better with Javascript
http://www.commitstrip.com/2019/04/19/its-better-with-javascript/" @CommitStrip April 19, 2019
- "It’s better with Javascript
- 2019-11-04 JavaScript isn’t always available and it’s not the user’s fault
the problem is less about the 1% of users who always visit your site without JavaScript and more about the 1% of visits to your site which result in users experiencing your site without JavaScript
- ^^^
If you had an application bug which occurred 1% of the time, you’d fix it. No team I’ve come across would put up with that level of reliability.
- 2019-11-04 A fictitious, somewhat farcical conversation between me and the JavaScript programming language (humor) (too real)
- Criticism: 2020-01-01 Putting Devs Before Users: How Frameworks Destroyed Web Performance
… many sites now using frameworks like React and Vue, SPAs becoming commonplace and requests going into the hundreds, the average webpage is now bigger than ever, with 2–3MB pages …
- Criticism of the state of the "art" as of 2020-05-25: Today’s Javascript, from an outsider’s perspective
- Thread criticizing JS frameworks (in particular React) https://twitter.com/zachleat/status/1290998533106040833
- "“you see, the giant JavaScript bundle actually makes the page faster…”" @zachleat August 5, 2020
- Countermovement: https://nojs.club/
- https://twitter.com/andrewcb/status/1367245083796369409
- "Stop doing JavaScript: Documents were not supposed to be Turing-complete" @andrewcb March 3, 2021
- https://twitter.com/gesa/status/1387601600378638339
- "Hello this is the co-chair of TC39 speaking. We specify and publish the JavaScript standard. I’m here to report that JavaScript is not intended for medicinal purposes, please speak with your doctor if you need healing cuz all we produce is sadness. 😅😘♥️
https://twitter.com/IanColdwater/status/1387599363929624576?s=19" @gesa April 29, 2021
- "Hello this is the co-chair of TC39 speaking. We specify and publish the JavaScript standard. I’m here to report that JavaScript is not intended for medicinal purposes, please speak with your doctor if you need healing cuz all we produce is sadness. 😅😘♥️
- Positive example of starting with javascript as a way of learning programming: https://twitter.com/bengoodger/status/1465726650398568453
- "I saw there was some discussion on here last week about how we shouldn't celebrate developers who don't know how the whole system works, end-to-end. 🧵/1" @bengoodger November 30, 2021
- Great flowchart explaining why the "Everyone has JS" assertion from modern webdevs is often false for a variety of reasons: https://kryogenix.org/code/browser/everyonehasjs.html
- Criticism: More JS, More multiplicative risks: thread: https://twitter.com/slightlylate/status/1592834631468220417
- "I need to blog about the Principle of Minimal Client Complexity, but one way to understand why I push back so hard on huge stacks of JS is that when you move thing to the client, you don't add risks from each uncontrolled dimension, you _multiply_ them.
What are those risks?" @slightlylate November 16, 2022
- "I need to blog about the Principle of Minimal Client Complexity, but one way to understand why I push back so hard on huge stacks of JS is that when you move thing to the client, you don't add risks from each uncontrolled dimension, you _multiply_ them.
Open Source IndieWeb related projects and tools | |
---|---|
Topics | Why open source? • How to open source a project • Open for contributions • IndieWeb Principles |
PHP | b2evolution • CASSIS • Known • Falcon (portions) • p3k • stapibas • dobrado • Grav • Miniflux-legacy • ProcessWire • Reader Self • Textpattern • tt-rss • Twyne • TYPO3 |
WordPress (PHP) | Indieweb Plugin • Webmention • Semantic Linkbacks • Micropub • IndieAuth • Post Kinds • Syndication Links • WebSub plugins • See Template:WordPress for others. |
Python | Bridgy Fed • BeautifulSoup • Bleach • Bundle • django CMS • IndieWeb Search • IndieWeb Utils • kaku • mf2util • Nefelibata • ninka • Publ • python-indieweb • Red Wind • Requests • ronkyuu • Woodwind |
Ruby | Dark Matter • Feedbin • FrancisCMS • Micropublish • Publify • Ruby on Rails • Sinatra • Singulus • Transformative • webmention.io • Jekyll |
JavaScript | AerosolCMS • CASSIS • Ghost • Camel • IndieKit • Eleventy |
Others | Hugo (Go) • Firefox • NetNewsWire |