18
IT-SDC : Support for Distributed Computing Choosing a JavaScript MVC Framework Héctor Martín IT/SDC May 9, 2014

Choosing a JavaScript MVC Framework Héctor Martín IT/SDC May 9, 2014

Embed Size (px)

Citation preview

Page 1: Choosing a JavaScript MVC Framework Héctor Martín IT/SDC May 9, 2014

IT-SDC : Support for Distributed Computing

Choosing a JavaScript MVC Framework

Héctor MartínIT/SDC

May 9, 2014

Page 2: Choosing a JavaScript MVC Framework Héctor Martín IT/SDC May 9, 2014

2IT-SDC

TABLE OF CONTENTS

I. Top current frameworks.II. Popularity.III.Introduction.IV. Features.V. Philosophy.VI. Why Ember?VII. Conclusions and future work.

09/05/2014Héctor Martín de los Ríos

Page 3: Choosing a JavaScript MVC Framework Héctor Martín IT/SDC May 9, 2014

3IT-SDC

TOP CURRENT FRAMEWORKS

09/05/2014Héctor Martín de los Ríos

Page 4: Choosing a JavaScript MVC Framework Héctor Martín IT/SDC May 9, 2014

4IT-SDC

POPULARITY I: GITHUB

09/05/2014Héctor Martín de los Ríos

Page 5: Choosing a JavaScript MVC Framework Héctor Martín IT/SDC May 9, 2014

5IT-SDC

POPULARITY II: STACKOVERFLOW

09/05/2014Héctor Martín de los Ríos

Page 6: Choosing a JavaScript MVC Framework Héctor Martín IT/SDC May 9, 2014

6IT-SDC

POPULARITY III: STACKOVERFLOW

09/05/2014Héctor Martín de los Ríos

Page 7: Choosing a JavaScript MVC Framework Héctor Martín IT/SDC May 9, 2014

7IT-SDC

MOST POPULAR FRAMEWORKS

09/05/2014Héctor Martín de los Ríos

Page 8: Choosing a JavaScript MVC Framework Héctor Martín IT/SDC May 9, 2014

8

INTRODUCTION

09/05/2014Héctor Martín de los Ríos

ANGULAR EMBER

Extending HTML syntax

20112009

Convention

Biggest community Second biggest community

None Handlebars.js (14kb), Ember-data (19kb) & Jquery.js (32kb)

36 kb 71 kb

FIRST RELEASE

PILOSOPHY

COMMUNITY

DEPENDENCIES

SIZE (min + gzip)

Page 9: Choosing a JavaScript MVC Framework Héctor Martín IT/SDC May 9, 2014

9

FEATURES

09/05/2014Héctor Martín de los Ríos

ANGULAR EMBER

URL DRIVEN Built-in but rudimentary Built-in

UI DECOUPLED Manual Ajax or Restful Client Built-in

MODULAR Good separation of concerns Very strict separation of concerns

POPULAR UI ELEMENTS

- Google Chart Tools - External libraries

- Ember Charts- Jquery plugins

- External libraries

Page 10: Choosing a JavaScript MVC Framework Héctor Martín IT/SDC May 9, 2014

Héctor Martín de los Ríos 10

FEATURES

09/05/2014

ANGULAR EMBER

VIEW TEMPLATES Declarative DOM-based String based. Handlebars

NESTED VIEWS Only with UI-Router Built-in

DATA BINDING Two way. Dirty-checking Two way. Change listeners

Page 11: Choosing a JavaScript MVC Framework Héctor Martín IT/SDC May 9, 2014

Héctor Martín de los Ríos 11

DIFFERENT PHILOSOPHY

09/05/2014

 

 

 

 

You want to do this? Do it this way

"You want to do this? Here's everything you will need to do it, use it"

Page 12: Choosing a JavaScript MVC Framework Héctor Martín IT/SDC May 9, 2014

Héctor Martín de los Ríos 12

WHY EMBER?1. Robust and Maintainable. - Structure:

09/05/2014

Page 13: Choosing a JavaScript MVC Framework Héctor Martín IT/SDC May 9, 2014

Héctor Martín de los Ríos 13

WHY EMBER?1. Robust and Maintainable. - Conventions:

09/05/2014

Page 14: Choosing a JavaScript MVC Framework Héctor Martín IT/SDC May 9, 2014

Héctor Martín de los Ríos 14

WHY EMBER?2. Ember-data.

09/05/2014

Page 15: Choosing a JavaScript MVC Framework Héctor Martín IT/SDC May 9, 2014

Héctor Martín de los Ríos 15

WHY EMBER?3. Performance.

09/05/2014

Page 16: Choosing a JavaScript MVC Framework Héctor Martín IT/SDC May 9, 2014

Héctor Martín de los Ríos 16

WHY EMBER?4. Routing.

09/05/2014

Page 17: Choosing a JavaScript MVC Framework Héctor Martín IT/SDC May 9, 2014

Héctor Martín de los Ríos 17

WHY EMBER?5. Debugging.Ember Inspector.

09/05/2014

Page 18: Choosing a JavaScript MVC Framework Héctor Martín IT/SDC May 9, 2014

Héctor Martín de los Ríos 18

CONCLUSIONS AND FUTURE WORK

Ember selected. Robust and Maintainable. Performance. Ember-data.

Format Json properly.

Migrate the sam3 app as a real usecase.

09/05/2014