This may sound like a silly question but I'm going to ask anyway because it's almost affecting my learning ability. :)
Why do we use JavaScript to change HTML and CSS elements in a webpage when we can just do that in HTML and CSS? As I'm learning JavaScript and changing elements in the DOM I'm asking myself why... why would you want to randomly change text color?
My idea is that they're event based changes and more for the interaction between user and webpage? Like in an image carousel, clicking the arrows would slide in a new image.. am I on the right track with understanding?
Top comments (37)
Once the page loads, there is only so much you can do to meaningfully impact the interactions with pure HTML and CSS.
When I click the ❤️ button on this post, a couple things happen:
Some things can be done with pure CSS and HTML but it's always going to be limited. JavaScript is a full-on programming environment loaded into your browser. You can do basically anything, including updating the DOM to your hearts content.
Ask yourself whether you really need to not reload the page -- and why. For shinyness? Oh, come on.
There are a number of reasons why a browser request is preferable to a page reload:
Aside from those pragmatic reasons:
If you absolutely need any of those UX features, why don't you just write a desktop application instead?
From the point of view of the user of the UI: because I can read and interact with the application on different laptops, PCs, tablets and smartphones, and all I need is one ubiquitous kind of application (i.e. a web browser) and my login credentials.
From the point of view of the creator of the UI: because I can create an application that people can read and interact with on different laptops, PCs, tablets and smartphones, without me needing to make and maintain separate applications for all those types of hardware.
Cross-platform development exists - and targeting different operating systems is much less error-prone than targeting different web browsers. Heck, Firefox 62 renders stuff differently than Firefox 61! And this should be "easier" to do right?
Fair enough, but that such differences in rendering typically result in having an imperfect but quite usable web app on pretty much all modern browsers (unless you're doing really fancy things). So you immediately cast a very wide net.
For cross-platform (say the latest few Windows versions, the most prevalent linux distros, OSX and IOS, android - nothing exotic), you have to actively account for each of those groups, and make sure that executables or installers are available, including distributing updates. It's perfectly doable of course, but it's very much not in the same category of effort as a web app.
Because you'll have to adjust your "web app" twice a year because of moving standards while your desktop application can, in theory, still be used in ten years.
UX, submitting a raw POST request every time you clicked 💖 would be incredibly annoying and reset the scroll bar back to the top, among other things
It's not annoying, it's natural. There already is a better solution if you absolutely want that: write actual desktop applications...!
the browser is a desktop application. think of your web browser similar to a game launcher. bringing my code to you in a secure environment and with automatic updates.
Makes a lot of sense. That would almost be like a video game completely reloading every time the player makes a move.
The browser is a desktop application.
The browser is not an operating system.
But please humor me: how is a web browser, a glorified document viewer that only understands one scripting language which does not even have strong typing, a "secure environment"?
There are reasons why video games are usually running natively.
"secure environment" was referring to site isolation, requiring https for many APIs, not being able to access the user's local machine, etc.
"The browser is not an operating system" but it can be. and will be in the coming future. if not now. the web has evolved.
"glorified document viewer" the web has evolved. a lot. we've done a lot in the past 30 years. with the vast majority of that change in the past 5 or so actually.
"one scripting language" it's the language of the Web, and many many things compile to JavaScript. with more things every day (the most widely used high level programming language on the planet)
"does not even have strong typing" natively. yet. but many of the compile-to-JS languages do.
"reasons why video games are usually running natively" lack of certain networking protocols (recently added as WebSocket and WebRTC) and memory constraints (most browsers crash a page if it passes 1GB in a tab, but that could easily be changed or given as a permission to the user)
Still notably less secure than your operating system's exploit mitigation techniques.
It cannot, since it needs a kernel at the very least.
That might sound pessimistic, but I'm willing to call it devolved instead. People abuse the web. A lot.
Just because something is the only choice, it is not a good choice.
I see no sign of that ever changing.
Which is irrelevant as the browser will still only see the broken result.
And you don't see a problem with "applications" requiring more than 1 GB of RAM? Because I do.
I think the user should have more control over what the browser allows pages to do but I do think that at the end of the day, if your computer can do it, the web should be able to do it too. and no i don't see a problem with pages using more that 1GB of RAM since many games use more than 1GB and i'd love for them to come to the web. the Web has more work to do to in regards to functionality and user control but if you think that web should only be used to pass files around then there isn't much I could say to convince you we're on a good road. however, I believe that the web is the best platform for application deployment ever made even though it wasn't originally made for that 30 years ago (and can still be used for open directories). many of the services we take for granted nowadays simply couldn't exist on the web back then because internet infrastructure did not have the bandwith to support the web as an application distribution platform. but that's changed since and the browsers are catching up.
If you buy a computer for nothing else but using the web, that might be fine. But I don't.
I think most people like the convenience of not having to install a desktop app for every single thing they use their computers for. The space alone on that would get kind of crazy. I use my computer for a lot and a lot of the time I have a web app open.
That's the good thing: Most things people need come preinstalled with their computers, even e-mail clients. What else? Office software? A one-time installation.
A funny claim, given that web-based software (running on a headless web browser), like Visual Studio Code and Slack, makes the largest downloads today. Good desktop software is notably smaller, faster and more secure than its web equivalents.
Bring one counter-example please.
People do a lot more on their computers than just microsoft office and default email. Sometimes it's just easier to open one desktop app (the browser) and do a lot from there. The average user doesn't really care much about technical specs, they just want convenience.
Out of curiosity, why are you anti web app?
Desktop applications are convenient.
I even dislike the term "web app". The web is not an application platform, the browser is an application. You cannot run a web browser without installing a local piece of software - so why do you think every other piece of software needs to run inside it?
"Web applications" are:
Honestly, "web applications" are a thing for consumers. My mother would love them. Once you care what actually happens to your computer, you should be afraid of them.
Your mileage may (and obviously does) vary.
How do you quote in the comments? :)
By using Markdown. I'm pretty sure that someone wrote a web app for that if you wish ...
Ok I didn't invent web apps, no need to get upset with me... but thanks for the link.
Well we could standardize a file format for making desktop applications using HTML, CSS, and JS so that you'd just run the file with the browser of your choice, but then at that point you're making an open source
jarfile (which could be a good idea if done right)those programs are big because they're packaging the whole headless browser with them which is unnecessary.
And still slow and insecure, even without it...
You would notice if I was upset ... :-)
However, 1:30 AM here. Good night. ;-)
Good night. lol, had to.
Thanks Ben! I guess it's about being patient, learning, and then seeing what it can do. I'm such a "why" person lol. Which I guess is what will make me a great developer.
Yeah, asking why a lot will indeed make you great.
But it's also a complicated craft, and the why questions go deeper and deeper and deeper, don't be afraid to always just do and let the why figure itself out as you go.
True! I just got through learning JavaScript basics so there's definitely a lot I still have to learn about it. Any tips on practicing the basics? Not quite sure what to do in that aspect. I've created some very simple things like "what's the biggest number" that my kids actually like messing around with, I've done a simple password validation function... things like that.
I have gotten a ton of mileage out of seeing things on posts or on sites or just mentioned and going "I wonder if I can do that." Even if it's a huge fail -- you can learn a ton by trying. I know I also learned a ton reinventing a billion wheels. So sort of -- how to do things super manually. How to copy an entire HTML element "by hand" with JS -- don't use any packages or helpers, just builtin browser APIs. How can you use JS to get that element, all in contents and everything, to another spot in the page? that kind of thing.
I didn't even know it was possible to recreate just in JavaScript. It's definitely a powerful language. Thanks!
You can do so many different things with the same code: desktop app, chat bot, website, Excel addin, web API... Such a wonderful gain in efficiency, collaboration and knowledge sharing that any inefficiencies of the actual code are really insignificant in comparison.
I actually try to keep an up-to-date list of what you can do with JS, and is challenging :))