This is a guest blog post by Lyons Consulting Group,
a Demandware Strategic Solutions Partner
If there’s one thing you can say about the life of a
web developer in 2015, it’s that it wasn’t boring. The pace of change in our
industry has increased exponentially over the last few years, with new
frameworks, build tools, and techniques coming out seemingly every week. Even
if you don’t have the time to play around with or use the latest technologies,
you must at least have an understanding of what everything does if you want to
maintain parity with your peers.
To help you stay abreast of the latest trends on tap
for 2016, Lyons Consulting Group has compiled a list of what we think will be
some of the biggest topics in web development, design, and the Demandware
platform this year.
JavaScript
There’s a battle for the soul of web development,
and it runs right through the main programming language used on the
web—JavaScript. Here are some of the
issues to take note of:
·
Ember. Angular. React. npm. gulp. grunt. webpack. Some of you may
remember the good old days where all you needed was a code editor and some
HTML, CSS, and a bit of JavaScript and voila, you had a site. No more.
Now as the frameworks shake out, there seems to be a
divide opening up between two different world views… you can either adopt a “do
it all” comprehensive framework like Ember, Angular or Meteor (for you Node
fans), or you can implement a “million little pieces” paradigm using React and
a bevy of supporting npm modules to handle all your different needs that you
string together yourself (routing, file concatenation / minification, ES6 / JSX
transpiling, JS linting, hot browser reloading, etc.).
Demandware has already started using CommonJS-style
imports for JavaScript files, as well as grunt/gulp for build tasks.
The React library is taking the development world by
storm. It would be easy to overlook the things that React brings to the table
because of “JavaScript fatigue” and the constant churn of new libraries, but
React seems to be a game-changer. The React team seems to have taken all the
lessons learned from previous frameworks (the complexity of two-way data
binding, the DOM performance bottleneck, the forest of templating languages,
etc.), and fashioned a thoroughly modern way of making websites. And React
Native may let us use open web technologies to give native device languages a
run for their money. And I haven’t even mentioned isomorphic JavaScript.
·
ES6, the shiny new version of JavaScript (also known as ECMAScript 6 or
“JavaScript 2015”) has made inroads over the past year and adoption will
continue in 2016. This has been driven by transpilers like Babel (an npm
module) and libraries like React, which are a good fit with some of the new
functional programming techniques used in ES6.
Design
·
Mobile-first and responsive design will continue to play a bigger role
in web development and ecommerce in particular. In the most recent Demandware
Shopping Index, we see that phones accounted for all the year-over-year gains
in both traffic and basket creation.
·
Akamai released a report that showed that mobile users spend more on
ecommerce than desktop users. Instead of being an afterthought, mobile designs
and implementations will take a front seat with desktop following. And
mobile-first SiteGenesis design is now on the 2016 Demandware road map.
·
Mobile-first design is further emphasis that we’ll continue seeing the
evolution of responsive imagery techniques continue apace, as a big chunk of
current page weights is imagery.
A common strategy is to use the new (official spec)
“srcset”, “sizes”, and “picture” (using Picturefill as a backup) to provide
different images for different screen sizes / devices, saving mobile users from
downloading huge costly images. The technique is explained here.
·
Continued evolution of popular front-end frameworks – with leaner Sass,
improved grid mixins, full accessibility, and Flexbox support, Foundation and
Bootstrap should see increased adoption.
·
And now that we have CSS pre-processing tools like Sass, why not do
some post-processing? We’ve used Sass for a year or two now, so we’re able to
look at the pros and cons of CSS pre-processing with a little more judgment and
less hype. While the performance of a Ruby-based setup was horribly slow (10
seconds to build CSS?), developers quickly discovered node-Sass as part of a
grunt/gulp build process could give them sub-second compile times. A common
complaint still is the use of nesting CSS selectors, which makes it harder to dive
into an existing Sass file to start hacking and also may generate crazy
compiled CSS. Best practices seem to be shaking out.
·
Tools like PostCSS allow you to write syntax closer to actual CSS and
then drop plugins as more features become standard CSS. Expect to see the
discussion and friendly struggle between pre and post CSS processors continue
this year.
Demandware
Platform
·
Demandware continues to evolve with the introduction in 16.1 of the
JavaScript Controllers development model and updated SiteGenesis based on these
controllers. JavaScript controllers will enable developers to use JavaScript
files instead of pipelines for building Demandware storefronts, which
represents a big change in the way Demandware developers have traditionally put
together business logic on the server side. This new model gives the developer
some advantages, like making searches and merge conflicts easier to handle, as
well as giving us the ability to override specific functions of a controller
instead of the whole thing. And web developers come in the door knowing
JavaScript, so this should be a productivity boost for learning the platform
and finding new developers to work on Demandware stores.
·
To us, it’s online vs. offline (brick and mortar vs. click and mortar).
To consumers, it’s all just “shopping”. The Demandware omnichannel experience
continues to evolve in a few key ways. Some Demandware retailers offer loyalty
programs and gift cards that integrate in-store and offline buying. This gives
our customers the ability to see behavior across the buying spectrum and
provide targeted recommendations. Other retailers are implementing things like
endless aisle or order online/pick up in store.
·
With version 16.1, Demandware has started offering interesting social
integrations with third party platforms like Pinterest Buyable Pins. In the
Pinterest app (iOS and Android), customers can click a Buy button and have the
transaction processed on the Demandware side. The retailer can track Pinterest
transactions separately. With more than 70 million monthly active users,
Pinterest provides a ready-to-buy group of shoppers to Demandware retailers
with minimal setup on their side. Just another way Demandware is enabling and
improving the mobile shopping experience.
In the world of web development, the only constant
is change. It’s going to be an interesting year for developers, so make sure to
keep up.
Thanks to Michael Allinger, Matt Rose, and Dave Haas
for the technical review.