Ember.js vs React

Overview

Ember.js

Stacks1.6K

Followers865

Votes775

GitHub Stars22.6K

Forks4.2K

React

Stacks182.6K

Followers147.0K

Votes4.1K

GitHub Stars240.3K

Forks49.7K

Ember.js vs React: What are the differences?

Ember.js is a full-featured JavaScript framework that provides a convention-over-configuration approach for building web applications, while React is a lightweight JavaScript library known for its component-based architecture to create dynamic user interfaces. Here are the key differences between Ember.js and React:

Architecture and Approach: Ember.js follows the convention-over-configuration principle. It provides a complete solution for building web applications with a predefined folder structure, routing system, and data management. Ember.js promotes a "batteries included" approach, making it easier for developers to get started quickly. React, on the other hand, is a JavaScript library focused on building user interfaces. It provides a more flexible and minimalistic approach, allowing developers to make decisions about the architecture and libraries they want to use.
Component-based Development: Ember.js uses a component-oriented approach with a strong emphasis on two-way data binding. It provides a set of conventions and features, such as computed properties and observers, to handle data flow and keep components in sync. React, on the other hand, follows a unidirectional data flow and uses a virtual DOM to efficiently render components. React uses props and state to manage data flow and reactivity.
Learning Curve and Complexity: Ember.js has a higher learning curve compared to React due to its predefined rules and comprehensive feature set. Ember.js also has a larger API surface and may take more time to learn and master. React, on the other hand, has a simpler and more intuitive API, making it easier for developers to grasp the core concepts and get started quickly. React's documentation is extensive and provides clear guidelines.
Community and Ecosystem: React has a large and active community. It has a rich ecosystem of libraries, tools, and community-driven resources. React's ecosystem is constantly evolving, providing solutions for state management, routing, form handling, and more. Ember.js also has an active community, but it may not be as extensive as React's. Ember.js has its own set of libraries and add-ons, but the ecosystem may have a narrower scope compared to React's.
Longevity and Stability: Ember.js has been around for a longer time and has a more established track record in terms of stability and backward compatibility. It follows a strict release cycle and provides long-term support for major versions. React, while relatively newer, has gained significant adoption and has proven to be stable as well. However, due to its more flexible and evolving nature, React may introduce breaking changes with major releases, which may require some updates to existing codebases.

In summary, Ember.js is a framework with a convention-over-configuration approach, while React is a flexible library focused on building user interfaces.

Share your Stack

Help developers discover the tools you use. Get visibility for your team's tech choices and contribute to the community's knowledge.

View Docs

CLI (Node.js)

Manual

Advice on Ember.js, React

Cyrus

Aug 15, 2019

Needs adviceon

Vue.js

React

I find using Vue.js to be easier (more concise / less boilerplate) and more intuitive than writing React. However, there are a lot more readily available React components that I can just plug into my projects. I'm debating whether to use Vue.js or React for an upcoming project that I'm going to use to help teach a friend how to build an interactive frontend. Which would you recommend I use?

884k views884k

Comments

Cyrus

Aug 15, 2019

Needs advice

Simple datepickers are cumbersome. For such a simple data input, I feel like it takes far too much effort. Ideally, the native input[type="date"] would just work like it does on FF and Chrome, but Safari and Edge don't handle it properly. So I'm left either having a diverging experience based on the browser or I need to choose a library to implement a datepicker since users aren't good at inputing formatted strings.

For React alone there are tons of examples to use https://reactjsexample.com/tag/date/. And then of course there's the bootstrap datepicker (https://bootstrap-datepicker.readthedocs.io/en/latest/), jQueryUI calendar picker, https://github.com/flatpickr/flatpickr, and many more.

How do you recommend going about handling date and time inputs? And then there's always moment.js, but I've observed some users getting stuck when presented with a blank text field. I'm curious to hear what's worked well for people...

401k views401k

Comments

Malek

Web developer at Quicktext

Mar 28, 2020

Decided

The project is a web gadget previously made using vanilla script and JQuery, It is a part of the "Quicktext" platform and offers an in-app live & customizable messaging widget. We made that remake with React eco-system and Typescript and we're so far happy with results. We gained tons of TS features, React scaling & re-usabilities capabilities and much more!

What do you think?

244k views244k

Comments

Detailed Comparison

Ember.js	React
A JavaScript framework that does all of the heavy lifting that you'd normally have to do by hand. There are tasks that are common to every web app; It does those things for you, so you can focus on building killer features and UI.	Lots of people use React as the V in MVC. Since React makes no assumptions about the rest of your technology stack, it's easy to try it out on a small feature in an existing project.
Creating web apps;Building UI	Declarative; Component-based; Learn once, write anywhere
Statistics
GitHub Stars 22.6K	GitHub Stars 240.3K
GitHub Forks 4.2K	GitHub Forks 49.7K
Stacks 1.6K	Stacks 182.6K
Followers 865	Followers 147.0K
Votes 775	Votes 4.1K
Pros & Cons
Pros 126 Elegant 97 Quick to develop 83 Great mvc 82 Great community 73 Great router Cons 2 Very little flexibility 2 Too much convention, too little configuration 1 Hard to use if your API isn't RESTful 1 Hard to integrate with Non Ruby apps	Pros 837 Components 674 Virtual dom 579 Performance 509 Simplicity 442 Composable Cons 41 Requires discipline to keep architecture organized 30 No predefined way to structure your app 29 Need to be familiar with lots of third party packages 13 JSX 10 Not enterprise friendly
Integrations
Node.js AngularJS Bootstrap	No integrations available

What are some alternatives to Ember.js, React?

jQuery

jQuery is a cross-platform JavaScript library designed to simplify the client-side scripting of HTML.

AngularJS

AngularJS lets you write client-side web applications as if you had a smarter browser. It lets you use good old HTML (or HAML, Jade and friends!) as your template language and lets you extend HTML’s syntax to express your application’s components clearly and succinctly. It automatically synchronizes data from your UI (view) with your JavaScript objects (model) through 2-way data binding.

Vue.js

It is a library for building interactive web interfaces. It provides data-reactive components with a simple and flexible API.

jQuery UI

Whether you're building highly interactive web applications or you just need to add a date picker to a form control, jQuery UI is the perfect choice.

Backbone.js

Backbone supplies structure to JavaScript-heavy applications by providing models key-value binding and custom events, collections with a rich API of enumerable functions, views with declarative event handling, and connects it all to your existing application over a RESTful JSON interface.

Svelte

If you've ever built a JavaScript application, the chances are you've encountered – or at least heard of – frameworks like React, Angular, Vue and Ractive. Like Svelte, these tools all share a goal of making it easy to build slick interactive user interfaces. Rather than interpreting your application code at run time, your app is converted into ideal JavaScript at build time. That means you don't pay the performance cost of the framework's abstractions, or incur a penalty when your app first loads.

Angular

It is a TypeScript-based open-source web application framework. It is a development platform for building mobile and desktop web applications.

Aurelia

Aurelia is a next generation JavaScript client framework that leverages simple conventions to empower your creativity.

Flux

Flux is the application architecture that Facebook uses for building client-side web applications. It complements React's composable view components by utilizing a unidirectional data flow. It's more of a pattern rather than a formal framework, and you can start using Flux immediately without a lot of new code.

Famo.us

Famo.us is a free and open source JavaScript platform for building mobile apps and desktop experiences. What makes Famo.us unique is its JavaScript rendering engine and 3D physics engine that gives developers the power and tools to build native quality apps and animations using pure JavaScript.

Related Comparisons

Architecture and Approach: Ember.js follows the convention-over-configuration principle. It provides a complete solution for building web applications with a predefined folder structure, routing system, and data management. Ember.js promotes a "batteries included" approach, making it easier for developers to get started quickly. React, on the other hand, is a JavaScript library focused on building user interfaces. It provides a more flexible and minimalistic approach, allowing developers to make decisions about the architecture and libraries they want to use.
Component-based Development: Ember.js uses a component-oriented approach with a strong emphasis on two-way data binding. It provides a set of conventions and features, such as computed properties and observers, to handle data flow and keep components in sync. React, on the other hand, follows a unidirectional data flow and uses a virtual DOM to efficiently render components. React uses props and state to manage data flow and reactivity.
Learning Curve and Complexity: Ember.js has a higher learning curve compared to React due to its predefined rules and comprehensive feature set. Ember.js also has a larger API surface and may take more time to learn and master. React, on the other hand, has a simpler and more intuitive API, making it easier for developers to grasp the core concepts and get started quickly. React's documentation is extensive and provides clear guidelines.
Community and Ecosystem: React has a large and active community. It has a rich ecosystem of libraries, tools, and community-driven resources. React's ecosystem is constantly evolving, providing solutions for state management, routing, form handling, and more. Ember.js also has an active community, but it may not be as extensive as React's. Ember.js has its own set of libraries and add-ons, but the ecosystem may have a narrower scope compared to React's.
Longevity and Stability: Ember.js has been around for a longer time and has a more established track record in terms of stability and backward compatibility. It follows a strict release cycle and provides long-term support for major versions. React, while relatively newer, has gained significant adoption and has proven to be stable as well. However, due to its more flexible and evolving nature, React may introduce breaking changes with major releases, which may require some updates to existing codebases.

In summary, Ember.js is a framework with a convention-over-configuration approach, while React is a flexible library focused on building user interfaces.

Ember.js vs React