Hehe, I know that seems like a strange question, but I’m hoping this thread might generate some interesting discussion. Bear with me …
For a long time, JS has been used to enhance web pages, with such things as sliding carousels, popups, rate calculators, form validation and so on. These are all handy things, but kind of trivial in terms of what JS can do.
More recently, JS programmers have moved on to bigger things. We are in the age of “web apps”, it seems, and we see a lot of emerging frameworks, boilerplates etc. like Angular.js and Backbone.js. To be honest, though, being a JS noob myself, I’m really not clear on what these scripts are for. What are people actually using Angular.js and Backbone.js to do? I hear a lot about them, but haven’t got a clear idea of what they are really used to achieve. Does anyone have any real world examples they can share of what these tools are used for?
There’s also a lot of talk about Node.js as a tool for doing server side JS. That sounds great too, although I also find it hard to get a sense of what it’s really useful for. Explanations that it’s good for “non-blocking I/O and single-threaded event loops” etc. doesn’t give someone like me a very clear idea of where something like this would be useful. It would be cool to have a more layman’s description of where this would be useful (you know, the kind of simplistic description you might give to an eight year old!). I can tell it’s not so useful for a standard, static website, for example, but beyond that …
I’d really love to hear what people have to say about this. And although self promotion is generally shunned, if you’ve created something using any of the above, or something similar, I think it would be fine to mention it here and explain why you made the choices you did.
A great example of what you’re talking about would be Document Cloud, the platform was designed on top of Backbone.js which ironically was built by Jeremy Ashkenas who developed both Backbone.js and Underscore.js. The entire page seen at the link below gets generated by JavaScript on page load by using pre-loaded data that can be seen in the page source, the advantage to using pre-loaded data is that Backbone solves a key issue which is that it allows data to come from many sources instead of the one source which is a huge blocker when building websites and web apps.
As another key aspect of Backbone.js is that is has the notation of controllers, models and views which is something JavaScript is sorely lacking, ES6 helps by introducing classes but this really only solves the model aspect of web apps.
Another great example would be Rdio which is a service I personally use that runs on Backbone.js to load it’s entire music player inside the browser. http://www.rdio.com/
What is PHP? A programming language, interpreted. Ruby, Python the same. Javascript? The same. So why not move a Javascript interpreter at server-side? Why not indeed. Enter node.js
What about if someone would get serious about programming the client side? Wait, didn’t they already cover that with Java applets? Where you take bulk of the programming logic to the client side? They did, but… it didn’t quite took off.
So how come Angular took off instead? Because programmers and user agents alike got on HTML5 band wagon and realized Javascript is … a programming language. And they started acting like serious programmers and serious user agents. In that they finally realized that DOM handling is NOT javascript, instead, you do DOM with Javascript. Leaving many sides of Javascript open to exploration. Enter… Ember
Thanks for the reply, Chris. So are those two sites using JS because they really need to, or just because it’s cool? The document cloud site basically doesn’t exist with JS off, which always makes me a bit suspicious.
the advantage to using pre-loaded data is that Backbone solves a key issue which is that it allows data to come from many sources instead of the one source
Aren’t there backend technologies that could cater for that, though? Is there are particular reason to use JS?
@myty Thanks for your reply. I didn’t mention the new browser APIs in my first post, as it was getting a bit long, but they certainly are very cool. Are these what’s driving a lot of this? I don’t really associate Backbone, Anglular, Ember and the rest with these, but, as I say, their overriding purpose still isn’t clear to me.
I think one of the biggest advantages to building an app with JS is that you can create something which feels and performs more like traditional desktop app. By fetching data via AJAX and displaying views dynamically, you can do away with page reloads and provide a better experience for the user.
Fair enough—though Ajax can be done unobtrusively (such that the pages still work if JS is off) though these frameworks don’t seem to worry about that much. But are all these new frameworks etc. just about Ajax? I presume they do more than just that, as Ajax has been around a long time.
While HTML5 API, new functional programming API, enrich the language and its capabilities, Angular or Ember bring a method to the chaos Javascript pseudo-programming was, using OR NOT the new APIs.
I’ve said this in another post here, Angular is to AJAX what jQuery is to Javascript.
So does that mean they just make it easier to write JS in a better way? Would that be analogous to something like jQuery, which provides a somewhat different way to write JS?
(I’ve seen you speaking elsewhere about functional programming, and although I don’t know what that is, I can appreciate that there are different approaches to programming. I don’t really understand concepts like models, views and controllers etc. but I do appreciate that they represent a more efficient way to organise code etc.)
For sure. I think the real benefit to the frameworks/libraries is in providing some kind of structure to help with writing applications in JS. As you said in your first post, JS has long been used to enhance pages, but as we’ve started to build more complex apps with it it makes sense to employ some kind of framework (as is common on the server-side) to help keep the code organised and avoid reinventing the wheel each time and writing a lot of boilerplate code.
OK, maybe more like what Rails is to Ruby, or more like what Django is to Python. jQuery is more limited in scope: DOM. Backbone, for example, relies on jQuery functionality when it comes to DOM. So, jQuery is just a library, Angular, Ember, are full blown frameworks, that usually include libraries, link them together and create a faster to use programming environment.
In functional programming you worry about the problem, and a pattern to solve the problem, instead of chasing down code sequences and memory state. This usually means a higher-level programming with some new approach that takes some getting used to.
To not be confused with code architecture: model-view-controller (MVC), MVVM, etc. These kind of patterns tackle another software side: code organization and code delegation of scope. This helps clearly distinguish for an app which inside code part is doing what.
Ah, right. I hadn’t thought of them as being like a Ruby or PHP framework etc. That makes sense.
In functional programming you worry about the problem, and a pattern to solve the problem, instead of chasing down code sequences and memory state. This usually means a higher-level programming with some new approach that takes some getting used to.
Thanks. That makes sense too.
Do you have any sense of the sorts of sites that would benefit from using Node instead of, say, PHP or Ruby? Ideally, I’d love to have a sense of what kind of sites or apps would perfectly lend themselves to what Node offers, and perhaps why.
Recently I have been playing with JavaScript just to use the DOM. I like the idea of fast loading pages and really dislike pages that take more than a couple of seconds to load, especially those that show a blank screen before eventually showing all the flashing , whiz, bang gizmos.
In the above link I have tried to instantly show the “Golden Content” and then load 500 thumbnails in the background using the DOM. View the page source content and also copy and paste the link to your favourite Page Load Tester such as Pingdom. I was very surprised at the results.
On my Localhost I have also succeeded in loading and inserting pages into specific DIVs identified by their ID and it works fine. The pages can be text, Html and also Php scripts that retrieve database table data.
The first gain with node.js is that you use a single language, both on server side and on client side: Javascript. Otherwise, it’s perfectly replaceable with any other combination of server side technologies: Apache/PHP, nginx/PHP, Apache/fastCGI and so on.
Beside that what every technology or combination of technologies for server side has to offer better or less good, using Javascript all over assures that client side and server side speak with the same data labguage: Javascript or even JSON objects, and server side and client side programmers speak the same programming language.
Other details, like callback providing non-blocking and so on, are just highlights that can go wrong or prove to be stable. It all depends on moret han a single factor, so it’s hard to generalize. But the reality is that node.js it’s used for good.
Thanks John. I may sound like an old fart, but it still doesn’t convince me to see web pages that have no actual content and that are fully reliant on JS. Apart from SEO concerns, I’m still pretty welded to the concept of progressive enhancement, where JS of this sort is an enhancement rather than a life support. I’m still wondering if there are situations where this is unavoidable—such as with complex apps that can’t be expected to do anything in a non-JS environment. That would be the only way I can see that a JS framework can really be justified.
Yes, I do like the idea of having the same language on both sides of the fence, so to speak. But I thought there were compelling use cases for Node over other options other than just the convenience of one language.
Real-time chat apps are usually the ‘hello world’ equivalent for Node, as Node makes it very easy to deal with web sockets. I’ve also seen it used to control an RC helicopter, which I can’t imagine being possible with something like PHP. I think if you were building something like Google Docs and wanted to have real-time collaboration, a Node server would probably be idea for this sort of thing.
I’m sorry to disappoint you, it’s all about opting given that you build for heavy networking not for heavy computing. What node.js does great is handle communication, even real time, with great ease. What node.js doesn’t do well is demanding computation, like Fibonacci, or handle relational databases.
Anyway, if node.js or Angular is not enough to compel you, there are also Javascript microcontrollers like Tessel or Espruino.
But projects like TogetherJS should be enough incentive to get Javascript higher on your todo list.
It definitely started with Ajax, the natural progression was to move as much as makes sense to the client-side to improve performance and user experience. It’s got to a point where you don’t need to rely on server side technologies to deliver anything that the page already knows about.
When interactions in the browser reach a level of complexity with many moving parts these types of techniques do enhance the experience quite a bit.
These frameworks should give you better control over network requests and allow you to do more complex interactions close to the metal where the moving parts are. We will have to wait and see what becomes of these frameworks.
