I have a very different perspective than the author.
I've considered Libraries to be the pieces of code that let us 'paper over browser inconsistencies' to be things like jQuery. Sure, they also gave us some useful tools and plugins to accomplish tasks, but on the core purpose was to be able to write simple javascript code for common functions and have parity across all the major browsers.
Frameworks, I view at as code organization and paradigm tools. They create a more consistent structure for a group of developers to work on a single project. It aids in creating an MV* or other similar paradigm that a team can work within. Even outside of a team environment, Frameworks give you a ... framework, of how your app should be built, rather than just creating your own structure as you go along.
This is the reason why there are so many frameworks vs. libraries. Once you've chosen a library to handle browser inconsistency, as the author mentioned, barely an issue anymore, there is an endless possibility as to how your app should be structured. Some people like two-way data binding, some don't. Some people need extreme DOM performance of leveraging the virtual DOM, others hate the idea of having their html closely bound to their javascript (and framework as often the case).
I think yours is the traditional take on frameworks vs. libraries, so you're not alone. We have a lot of frameworks in JavaScript because we're still expanding and exploring the space where they can work. Eventually I think we'll settle on a smaller number of frameworks, but even so I doubt we'll see the level of consolidation that happened with libraries and jQuery.
I concur. I remember the days when there was explosion of Java framework last time, though the Java community at the time doesn't seemed to mind (they seemed to like choices) :-). There are some voices that complains of too many choices, but I think people generally agree there can be no One True Stack (TM).
As for preferring library over frameworks, sure why not. There are tons of reason to be able to do things other than the way that is described by a framework, but when you start to have teams bigger than 20, of different time zones, with varying skill level (important point here), having a prescribed way to do things may not be such a bad thing. There will be time to break the rules of the framework, but hopefully your choice of framework is good enough that it should only be less than 10% of the case.
To this, I can say that despite the failing of AngularJS, some teams just cannot live without it. Its very prescriptive to the point that people who a very good at Javascript may find it repulsive. But those prescription are just too robust for some team to abandon it and go for a more performant framework.
And there is a lot of companies that can't hire Google level developers. These people may not know Javascript enough, but are okay as long as there are good prescriptive example of how to do things. They should still aspire to be good at Javascript (or any language at that...), but sometimes that seems to be too much to expect for the portion of them. Sure, this is not ideal, but you have to remember, there are a lot of places in the world that IT is a cost center.
I disagreed with the author as well when I read this - libraries are a hodge podge of piecing stuff together, and when developers are left to their own devices, they often create an unreusable monster. Onboarding new developers also becomes harder due to it taking longer to understand the fundamental structure - there is not too much prior experience that can be drawn on to understand lower level logic.
You have a point, from my perspective though the difference between a light-weight framework like Backbone and one like Ember is almost as big as the difference between say Backbone and jQuery.
Don't throw the baby out with the bathwater. Sure JS frameworks are often unnecessary, that doesn't mean they aren't solving real problems.
The scope of applications and interactivity found in today's browser-based apps today dwarfs what we were doing even 10 years ago. The amount of experience and expertise that is being codified in (for example) Ember.js is fantastic and will allow you write much richer web apps in far less code than trying to achieve the same functionality with it.
Saying just use JS directly is sort of like saying don't bother with Rails, CGI.pm has everything you could ever need.
> Saying just use JS directly is sort of like saying don't bother with Rails, CGI.pm has everything you could ever need.
That pretty much sums up the article's stance on frameworks. Even with reusable components, there will be a need for frameworks because just using JS/CSS/HTML directly, one would essentially be creating a framework with each application. There are standard things that a framework encapsulates in any language or target environment which will be unnecessarily repeated and sub-optimally created if one decided to start from scratch on every application. I think the author misses this part completely. While learning a framework enough to start making things in it may take a day or two, creating a new framework because one hate using frameworks will take days to weeks and still likely leave desiring functionality they had not thought of or had implemented badly.
This is also going to vary depending on the domain problem. If you're aiming to make something large and comprehensive, it helps to start "a bit too crude" so that every assumption you make at the start is grounded in the understanding of where you want to go later. But if you're pumping out microsites, a framework automates the process and makes it easier to maintain a large body of them.
> The scope of applications and interactivity found in today's browser-based apps today dwarfs what we were doing even 10 years ago.
I'd dispute that. 10 years ago we had pretty brilliant browser based apps. They just happened to be using flash or Java applets whereas now they're using javascript.
Actually, I wrote a pretty complex browser-based app in 2002. It ran on Microsoft Explorer as it was the only capable browser at the time, and it used Javascript, XML and XSLT to construct a Windows-like UI environment within the browser -- you may check the code at https://bitbucket.org/BerislavLopac/waexplorer
I used the web 10 years ago, along with a lot of those flash and java applets, and I use the web now, along with a lot of these richly interactive javascript applications, and comparing then with now strikes me as truly ridiculous. The web is hugely more usable now.
There were but probably in-house non public ones. I had a course where the teacher explained how its company was building portable asynchronous desktop-like applications in JS since early 2Ks. Maybe the exception though.
A few examples would come in handy. The only place I can remember using flash and enjoying it was youtube. (And then only because there wasn't a better/standard way of playing videos.)
I've been seeing the term "web app" a lot lately. Not exactly sure why. Is a web app different from a website? I guess so probably maybe? I'm not really sure.
In my understanding, a webapp is essentially a "desktop-like" application for the browser, i.e. something like gmail or an online paint program, something that is interaction driven, will probably use websockets for giving a realtime feeling, etc. A website is the traditional static content, like a blog or a news site. Obviously, these are just relative and its a scale so there cross-over and sometimes its hard to define in exactly which category an app/site falls.
quite different--
Web app, think Google Docs/Sheets.
Web site, think blog, information landing page, or even web store product page(s).
Web app is highly interactive (may or may not be an SPA single page app), relying heavily on javascript for UI events, saving/fetching application state, remote datasets, and sometimes making use of modern HTML5 browser features.
Web site is displaying information and is just augmented with some javascript mostly for improving the UX or attaching analytics/social plugins etc.
"React isn't a framework, it's a library!" There I said it!
Jokes aside, React provides a Virtual DOM which isn't available natively. I'm sure sometime in the future browser's DOM tree estimation and computation would be so efficient that you wouldn't need a Virtual DOM anymore. Until then, React is the best way forward. There are plenty of thin VDOM libraries (some even more efficient than React) out there but the joy of working with code written as composable Components outweighs efficiency (I'm sure those libraries would fare far worse in benchmarks if composability is put into the equation). Couple this with a library like Om/Reagent and you get FP (code as data)+immutability handed to you on a silver platter.
Without the "right" libraries you introduce a lot of incidental complexity into your application development lifecycle.
> "React isn't a framework, it's a library!" There I said it!
React is a framework though, for the most part it calls you(r components), you don't call it outside of the original binding. It's not a huge one, but it's still one.
> I'm sure sometime in the future browser's DOM tree estimation and computation would be so efficient that you wouldn't need a Virtual DOM anymore.
Browsers already batch changes and defer recomputations as much as they can. They can't significantly improve the model because it requires a different abstraction which is not available under the existing DOM.
Also, you can use a VDOM without using React and its component, several VDOM-only pure=js libraries have sprouted up e.g. https://github.com/Matt-Esch/virtual-dom (the basis for elm-html, and the Mercury react-like framework)
Well, the virtual DOM is a great concept regardless - storing diff information on JavaScript is a great optimization, even if browsers eventually optimize browser rendering speeds, one will still be able to squeeze more with this & benefitting from that optimization.
I'm a huge fan of ReactJS, however it isn't a perfect or optimal implementation of it's concepts. Having a purely functional frontend, with immutability is key. ReactJS is leaky in it's mix of imperative and declarative code. FluxJS also suffers from this same issue.
ReactJS is the gateway drug to frontend nirvana. For more info:
None of the upgrades in ES6/ES7 obviate the need for frameworks. Maybe some libraries are made redundant, but frameworks address more interesting abstractions that a general language probably shouldn't cover anyway. Frameworks seem to adopt more opinions about implementation, and help unite a team over a set of ideas, and enable them to move faster and reason about similar problems in similar ways. Hopefully that team has picked a framework that is also well-suited towards the problem they're solving.
As a user of Angular, Backbone, and React (not all at the same time!), I feel like their largest benefit to me is in providing application structure -- good because as it has been said, if you aren't using a framework, you are writing your own.
I don't really see how any of the 3 items under the article's "So what do we need now?" will provide that benefit.
Not just structure, they enforce application architecture, something that you often miss until it's too late if you just get busy gluing together lots of npm modules to build your application.
This sort of attitude worries me, you don't need to use a framework to get this, you just need developers who have some knowledge of design/architecture, or who are the sort of people who will do research to find out.
I honestly think the framework enforcing architecture idea is more of an anti-pattern, even if you do use a framework you need to keep in mind that it wasn't built directly to fit your needs and that you may want/need to move in 6 months or a year.
I think it has to do with the way the developer approaches the problem, their background, and their preferences.
Personally I'm with you, I enjoy a small, isolated, component based approach where each component follows the unix philosophy. I think this lets you write the most performant and resuable code. Also, I think when following this style, it limits the scope of your dependences, which is another big plus. For instance, you might need a library for crypto, but you won't need one for doing your authentication system, and you won't have massive modules for handling auth that would come from a framework getting compiled into your production code.
But when you go this route you do have to make a lot of "right" decisions that are made for you when using a framework. Also, I think a lot has to do with deadlines and developer speed, it initially takes a little longer to write good standalone components that are reusable, and just grabbing some framework will help get shit done in the short term, but might have the same detriments as technical debt in the long run.
Yeah that's my attitude too, Ember scared me away because of the kitchen sink approach and the fact it introduced lots of new abstractions that I hadn't seen proven elsewhere, and that didn't really seem to me to be what I would be expecting from a Web framework.
Something like React bothers me far less as it smaller, less imposing, and solves real problems I've seen with other frameworks (for example by pushing clear/consistent/simple communication paths).
The only js framework I'm aware of that could accurately be described as trying to solve everything and the kitchen sink is ExtJs, which includes a wide widget library, and is very opinionated about how you interact with the DOM. Ember is is not a "kitchen sink" framework, and Backbone is certainly not.
I've found that even if you start with the "basics", like the author describes, that you'll end up finding that you repeat the same types of tasks repeated. So, you refactor and make functions that simplify common actions. After a while, I guarantee you that your code will look a lot like a framework.
Frameworks are created because they make solving certain types of problems easier and reduce code duplication, whether you use someone else's or your own.
A framework has control of the application by default and gives control to your code at designated points, to perform some computation and then return control to the framework.
A library takes control of the application when/where your code calls it, performs some computation and then returns control to your code.
A library is a way to reuse code; a framework is a way to reuse application structure/design and control flow.
The pain points of frameworks are well known at this point, I guess the question is given a really good set of high-level libraries, could you be as productive as you are using a framework? Maybe not at first, because you have more design choices to make. But later, you have less of other people's design choices restricting you.
> The problem is that now you have two systems to learn, HTML+CSS+JS, and the framework
Besides that there are 4 things listed there, not to mention how each interacts with the other, this is not a problem. If you shy at learning an additional thing, you should get out now.
That's not to say you shouldn't strive to reduce complexity and dependencies, that's a laudable and useful goal. But it's my personal opinion that every programmer out there should know at least a handful of languages, concepts, paradigms or frameworks that they don't like or have no use for--it's the same basis of learning more from failure than success.
That being said, I sincerely disagree with the assertion of the article, if on nothing more than the abstraction argument. The abstractions of jQuery have saved me so much time over the years with systems that work great in the latest and greatest browser, and work well enough, possibly with minor tweaks, in older browsers. Rewriting browser detection junk and making sure each control mostly works independent of browser and engine would be a much larger waste of my time than learning three or four js frameworks.
Readit News
I've considered Libraries to be the pieces of code that let us 'paper over browser inconsistencies' to be things like jQuery. Sure, they also gave us some useful tools and plugins to accomplish tasks, but on the core purpose was to be able to write simple javascript code for common functions and have parity across all the major browsers.
Frameworks, I view at as code organization and paradigm tools. They create a more consistent structure for a group of developers to work on a single project. It aids in creating an MV* or other similar paradigm that a team can work within. Even outside of a team environment, Frameworks give you a ... framework, of how your app should be built, rather than just creating your own structure as you go along.
This is the reason why there are so many frameworks vs. libraries. Once you've chosen a library to handle browser inconsistency, as the author mentioned, barely an issue anymore, there is an endless possibility as to how your app should be structured. Some people like two-way data binding, some don't. Some people need extreme DOM performance of leveraging the virtual DOM, others hate the idea of having their html closely bound to their javascript (and framework as often the case).
As for preferring library over frameworks, sure why not. There are tons of reason to be able to do things other than the way that is described by a framework, but when you start to have teams bigger than 20, of different time zones, with varying skill level (important point here), having a prescribed way to do things may not be such a bad thing. There will be time to break the rules of the framework, but hopefully your choice of framework is good enough that it should only be less than 10% of the case.
To this, I can say that despite the failing of AngularJS, some teams just cannot live without it. Its very prescriptive to the point that people who a very good at Javascript may find it repulsive. But those prescription are just too robust for some team to abandon it and go for a more performant framework.
And there is a lot of companies that can't hire Google level developers. These people may not know Javascript enough, but are okay as long as there are good prescriptive example of how to do things. They should still aspire to be good at Javascript (or any language at that...), but sometimes that seems to be too much to expect for the portion of them. Sure, this is not ideal, but you have to remember, there are a lot of places in the world that IT is a cost center.
The scope of applications and interactivity found in today's browser-based apps today dwarfs what we were doing even 10 years ago. The amount of experience and expertise that is being codified in (for example) Ember.js is fantastic and will allow you write much richer web apps in far less code than trying to achieve the same functionality with it.
Saying just use JS directly is sort of like saying don't bother with Rails, CGI.pm has everything you could ever need.
That pretty much sums up the article's stance on frameworks. Even with reusable components, there will be a need for frameworks because just using JS/CSS/HTML directly, one would essentially be creating a framework with each application. There are standard things that a framework encapsulates in any language or target environment which will be unnecessarily repeated and sub-optimally created if one decided to start from scratch on every application. I think the author misses this part completely. While learning a framework enough to start making things in it may take a day or two, creating a new framework because one hate using frameworks will take days to weeks and still likely leave desiring functionality they had not thought of or had implemented badly.
I'd dispute that. 10 years ago we had pretty brilliant browser based apps. They just happened to be using flash or Java applets whereas now they're using javascript.
Web site, think blog, information landing page, or even web store product page(s).
Web app is highly interactive (may or may not be an SPA single page app), relying heavily on javascript for UI events, saving/fetching application state, remote datasets, and sometimes making use of modern HTML5 browser features.
Web site is displaying information and is just augmented with some javascript mostly for improving the UX or attaching analytics/social plugins etc.
web sites are content centric and made for consuming it.
web apps are interaction centric and made to "do" something.
Web App are application like website.
So instead of traditional application/program such as Quicken we got Mint.com now. It makes application OS agnostic now too.
Web sites are bunch of pages that are hot link or connected via URL. Think of the old days of geocities, xoom, tripod, etc..
Jokes aside, React provides a Virtual DOM which isn't available natively. I'm sure sometime in the future browser's DOM tree estimation and computation would be so efficient that you wouldn't need a Virtual DOM anymore. Until then, React is the best way forward. There are plenty of thin VDOM libraries (some even more efficient than React) out there but the joy of working with code written as composable Components outweighs efficiency (I'm sure those libraries would fare far worse in benchmarks if composability is put into the equation). Couple this with a library like Om/Reagent and you get FP (code as data)+immutability handed to you on a silver platter.
Without the "right" libraries you introduce a lot of incidental complexity into your application development lifecycle.
React is a framework though, for the most part it calls you(r components), you don't call it outside of the original binding. It's not a huge one, but it's still one.
> I'm sure sometime in the future browser's DOM tree estimation and computation would be so efficient that you wouldn't need a Virtual DOM anymore.
Browsers already batch changes and defer recomputations as much as they can. They can't significantly improve the model because it requires a different abstraction which is not available under the existing DOM.
Also, you can use a VDOM without using React and its component, several VDOM-only pure=js libraries have sprouted up e.g. https://github.com/Matt-Esch/virtual-dom (the basis for elm-html, and the Mercury react-like framework)
ReactJS is the gateway drug to frontend nirvana. For more info:
http://computationallyendowed.com/blog/2014/07/20/reactive-m... (MVC in a Reactive World) http://elm-lang.org (ELM Language) https://github.com/swannodette/om (Om/Clojurescript)
These will be _the_ technologies and approaches in 2015. ReactJS/FluxJS are great, but imperfect implementations!
I honestly think the framework enforcing architecture idea is more of an anti-pattern, even if you do use a framework you need to keep in mind that it wasn't built directly to fit your needs and that you may want/need to move in 6 months or a year.
But all these old monolithic frameworks/libraries, that try to solve everything and there citchen sink, are so 2009-ish.
They have its place in the enterprise world. And for performance optimisation you want a more modular approach.
Personally I'm with you, I enjoy a small, isolated, component based approach where each component follows the unix philosophy. I think this lets you write the most performant and resuable code. Also, I think when following this style, it limits the scope of your dependences, which is another big plus. For instance, you might need a library for crypto, but you won't need one for doing your authentication system, and you won't have massive modules for handling auth that would come from a framework getting compiled into your production code.
But when you go this route you do have to make a lot of "right" decisions that are made for you when using a framework. Also, I think a lot has to do with deadlines and developer speed, it initially takes a little longer to write good standalone components that are reusable, and just grabbing some framework will help get shit done in the short term, but might have the same detriments as technical debt in the long run.
Something like React bothers me far less as it smaller, less imposing, and solves real problems I've seen with other frameworks (for example by pushing clear/consistent/simple communication paths).
Except React is a library. The slogan [1] clearly says "A JavaScript library for building user interfaces".
[1] http://facebook.github.io/react/
Frameworks are created because they make solving certain types of problems easier and reduce code duplication, whether you use someone else's or your own.
A framework has control of the application by default and gives control to your code at designated points, to perform some computation and then return control to the framework.
A library takes control of the application when/where your code calls it, performs some computation and then returns control to your code.
A library is a way to reuse code; a framework is a way to reuse application structure/design and control flow.
The pain points of frameworks are well known at this point, I guess the question is given a really good set of high-level libraries, could you be as productive as you are using a framework? Maybe not at first, because you have more design choices to make. But later, you have less of other people's design choices restricting you.
Besides that there are 4 things listed there, not to mention how each interacts with the other, this is not a problem. If you shy at learning an additional thing, you should get out now.
That's not to say you shouldn't strive to reduce complexity and dependencies, that's a laudable and useful goal. But it's my personal opinion that every programmer out there should know at least a handful of languages, concepts, paradigms or frameworks that they don't like or have no use for--it's the same basis of learning more from failure than success.
That being said, I sincerely disagree with the assertion of the article, if on nothing more than the abstraction argument. The abstractions of jQuery have saved me so much time over the years with systems that work great in the latest and greatest browser, and work well enough, possibly with minor tweaks, in older browsers. Rewriting browser detection junk and making sure each control mostly works independent of browser and engine would be a much larger waste of my time than learning three or four js frameworks.