30.05.2017 Views

Web_Designer_Issue_262_2017

You also want an ePaper? Increase the reach of your titles

YUMPU automatically turns print PDFs into web optimized ePapers that Google loves.

Which front-end frameWork?<br />

WHO ELSE TO CONSIDER<br />

Angular and React aren’t the only options on the<br />

table. So what else might we consider?<br />

EMBER<br />

emberjs.com<br />

“A framework for creating<br />

ambitious web applications”<br />

Ember aims to provide a complete solution for<br />

client-side development, and takes a strongly<br />

‘opinionated’ approach in doing so. While it doesn’t<br />

have the backing of a single major company like<br />

Google or Facebook, it’s nonetheless used on many<br />

popular sites, including LinkedIn, PlayStation Now<br />

and Apple Music.<br />

Ember uses the Handlebars templating engine,<br />

which provides the ability to embed expressions in<br />

the HTML to dynamically change what is displayed.<br />

Ember places heavy emphasis on components,<br />

using Handlebars to describe their appearance and<br />

JavaScript to implement behaviour.<br />

Ember may be a particularly good choice for<br />

developers who like their frameworks prescriptive<br />

and all-inclusive, and who lack the inclination to<br />

piece together libraries from multiple sources.<br />

Many find its learning curve to be challenging, and<br />

it may be quicker to put together smaller pages in<br />

something like React. Ember has, however, found<br />

particular popularity with developers using Rails<br />

for their backend, perhaps because Rails itself<br />

ofers a similarly opinionated design philosophy.<br />

WHAT TO LOOK OUT FOR IN <strong>2017</strong><br />

SVELTE<br />

svelte.technology<br />

Svelte is focused on being<br />

super lightweight, enabling<br />

faster loading and faster<br />

running apps. Could this be<br />

the beginning of a shift from<br />

heavyweight frameworks<br />

towards performanceoptimised<br />

approaches?<br />

AURELIA<br />

aurelia.io<br />

Developed by an ex-Angular<br />

team member, one of<br />

Aurelia’s primary focuses is<br />

modularity. There are<br />

evident similarities with<br />

Angular, but the syntax is<br />

simpler and closer to<br />

standard JavaScript.<br />

METEOR<br />

meteor.com<br />

“The fastest way to build<br />

JavaScript apps”<br />

Meteor is a full-stack framework, and like Ember,<br />

is highly opinionated. It comes with a front-end<br />

rendering system called Blaze, which can be<br />

swapped out for Angular or React if you so desire.<br />

Blaze uses a templating system, Spacebars,<br />

which is similar to Handlebars but takes advantage<br />

of some of Meteor’s more powerful features. The<br />

templates are very close to HTML, which makes<br />

them immediately readable. Many find that this<br />

sits in a sweet spot, ofering a gentler learning<br />

curve than Angular yet a more structured code<br />

style than React. Blaze also integrates very well<br />

with other JavaScript tools and libraries such as<br />

jQuery, and will not have issues with changes<br />

they make to the page.<br />

Meteor and Blaze may be particularly good<br />

choices for full-stack development, especially<br />

where a database is required, since they ofer<br />

particularly powerful integration between DOM<br />

and data sources. It’s also become a highly<br />

popular choice to combine Meteor with React,<br />

and the developers behind Blaze indicate that<br />

closer coupling of the two is likely in the future.<br />

CYCLE.JS<br />

cycle.js.org<br />

Cycle has been around for a<br />

couple of years, ofering a<br />

functional programming<br />

framework. There’s growing<br />

interest in functional web<br />

development these days,<br />

so we could see a rise in<br />

popularity this year.<br />

PREACT<br />

preactjs.com<br />

VUE<br />

vuejs.org<br />

“The progressive<br />

JavaScript framework”<br />

Vue was created by a single developer who had<br />

worked for Google on AngularJS. His objective was<br />

to build something that delivered its strengths<br />

while remaining lightweight and less opinionated.<br />

In a short space of time, its activity on GitHub had<br />

surpassed other popular frameworks and libraries.<br />

One of the key attractions to Vue for many<br />

developers is its simplicity and straightforward<br />

learning curve. It’s close enough to regular<br />

JavaScript that there is no need to learn complex<br />

syntax specific to the framework, and it also comes<br />

with very strong documentation.<br />

Vue ofers strong performance, outperforming<br />

both Angular and React in many benchmarks. This<br />

is in part because it implements a similar virtual<br />

DOM to React (and in fact Ember), enabling only<br />

the components that need changing to refresh.<br />

It’s apparent that Vue comes with a very fresh<br />

approach to the problems facing developers, and<br />

has learned from the journeys of both Angular and<br />

React. Overall, it may be a good choice for those<br />

new to developing with frameworks, who may not<br />

benefit from all the features of larger frameworks.<br />

Preact positions itself as<br />

a small, fast alternative to<br />

React. And weighing only<br />

3kB, it’s hard to dispute<br />

this. With growing concern<br />

about large framework<br />

footprints, could it gain<br />

ground this year?<br />

POLYMER<br />

polymer-project.org<br />

We’re banking on web<br />

components really taking<br />

of this year, and Polymer<br />

gives some insight into how<br />

developers may solve for<br />

componentisation in the<br />

future without relying on<br />

frameworks at all.<br />

72 ________________________________________________________________ feature

Hooray! Your file is uploaded and ready to be published.

Saved successfully!

Ooh no, something went wrong!