The marmelab blog

Minutes of DotJS 2016

Published on 22 December 2016 by Gildas & Kévin with tags conference js

We attended to the DotJS 2016 conference, which gave a voice to some big players of the Javascript world - despite a boiling hot incident! Here is our short feedback, conference by conference.

The DotJS 2016 conference

Service Worker and the “Appification” of the Web

According to Nolan Lawson, Progressive Apps are the next big milestone of the web, as important as the replacement of Flash by HTML5, because a web application should now be as enjoyable as a native application.

He explained how Service Workers can help us to reach this state with some example code. But his conference was mostly about all the possibilities this technology brings: offline support, push notifications, background synchronization, etc.

“The Web is for Everyone”

Developer of Microsoft Edge and PouchDB maintainer, he also noted the importance of “keeping the web for everyone, open and pluralistic”. To do him a favor, report bugs to your browser vendor!

Virtual Reality on the Web

Rose Edwards, from Samsung Internet, imagines a future where we’ll look at the current VR like we look at the old mobile phones now. This future might be ruled by a web-based “Remote Copresence”.

She proved that the technology to support this copresence is ready: rapid RTC peer-to-peer, audio streaming, performant CDN, Service Worker. Bringing them all together on the web will allow all users to use the same platform.

Perhaps the web VR platform will be specified by the W3C as a standard, and she works to make it a reality. Until VR becomes mainstream (she is convinced it will), we can enjoy a demo of what the VR on the web might looks like on gun.playcanvas.com.

Surgical usage of Babel

ES6 is almost fully supported by browsers (~90%) and Node, so why do we keep transpiling it to old JavaScript code? And what about the old versions? We can transpile our code with blazing fast performance, but not the with the approach “transpile all” from basic tutorials.

Christophe Porteneuve amazed the audience with his demo of Babel preset Env, a preset to rule them all, released two days before the dotJS. He gave great advice and tips for Babel, such as latest-minimal and so.

Will babel disapear at some point when all the platforms will fully support the Ecmascript specification? He anwsered that there will always some specs that’ll never reach stage-4, so Babel is here to stay - and it’s worth it.

Christophe Porteneuve - ES2016 support

Unbundling the Future Web

Guy Bedford presented us the upcoming (no ETA) new script tag type, module which allows to directly import modules and no longer a monolithic index.js file where all the code is bundled. More information on the WHATWG blog.

This might become the new code splitting mechanism. Exciting times!

Code sharing between pages, lazy loading, tree shaking optimization and dead code elimination… He explored all the possibilities and gave us some good advice and best practices.

Finally, he suggested his library: SystemJS, which supports most of these practices. He explained that all JS applications will need to expose their module graph, just like source maps, in order to make better tools in the future.

JavaScript Userland

Zeke Sikelianos introduced his talk with a review of the javascript userland. He remembered us about the old io.js vs node.js story, and how it allowed node.js to evolve in the right direction and become the platform we love today.

He then compared it with the current yarn vs npm dilemma, assuring that this new player in the js dependencies managers can only be a good thing for us all as we can see in this post about [email protected] (focus on performances and new shrinkwrap).

He then talked about the quality indicators available on github, and that they are not those than most people use. Download, for example, is flawed because of the Continuous Integration services which download them at each build. Stars are better, but don’t forget to check the pulse of a project, too.

Finally, he presented some web tools:

  • ghub.io: a simple redirector to the github page of an npm package. How many times did you ended up looking for package on google, only finding the npm page and finally using it to see the github repository? This is over with ghub.io, just type http://ghub.io/<package-name> and voila!
  • duckduckgo, the search engine without tracking also support some really interesting features such as bangs, allowing you to restrict searches to specific websites such as stackoverflow. You can find those for javascript here.

Crypto in Node.js

Fedor Indutny gave a talk about memory layout of V8’s heap. We must confess we were completely lost here…

Memory Layout is about translating high level language into CPU level language. It appears V8 has commands to debug JS at a very low level, which can be used more easily with llnode, a high-performance debugger for node.

LiveJS

LiveJS in action

Sam Wray and Tim Pietrusky are two incredible and crazy developers and musicians, who gave us an amazing audiovisual show! You can find it on YouTube.

This was featuring:

  • the web audio API to analyse sound and create realtime visualizations from it with canvas. The librairies used were meyda and modV.
  • the web midi API to control music devices and some other devices through a Raspberry (fog machine, lights and a LED curtain).

Next.js

Guillermo Rauch, the famous Zeit founder, presented Next.js.

He explained how and why “server rendering is not an option”, from his own words, for accessibility reasons. He denounced that the typical React application doesn’t load directly at first render (such as the react demo).

“There is no silver bullet, just tradeoffs”

That’s why he built Next.js: a micro-framework to server-render React applications. Component by component, Next.js is very simple, but takes a lot of technology to anticipate the user interaction.

For example, each Link component displayed on the screen pre-fetches the next page representation on the background via a Service Worker.

He shared a nice and optimistic vision of the web development, and when the master of ceremony asked him what the next big challenges are, he gave a twofold answer:

  • Have fast mobile applications with both JavaScript and performance
  • Stop changing frameworks every two weeks and be productive with what we have

How the web ecosystem shaped Angular

Igor Minar, lead developer of AngularJS at Google, listed what happened in the JavaScript world between Angular 1 and Angular 2.

Four years of evolution: ES6, Web Components, Observables/RxJS, Typescript, Embercli and a lot more (such as React, which is not a competitor, but an “idea challenger” for Angular, according to Igor).

But the most important piece of advice he wanted to give, especially to open-source maintainers, is to stay open minded. Inspiration and new ideas are everywhere, and it’s important to listen to each contributor. In the worst case, you might learn something.

Lightning Talks

An example of lightning talks

RxJS

Marko Kovacevic shortly presented Rx.js used with Redux and highlighted the chainable and declarative code it allows.

Lint Filters

Rolf Erik Lekang presented the auto fixing mechanism of eslint, and suggested lint-filters to gradually convert a project towards a new config.

Static React Websites

Maxime Thirouin presented phenomic.io, a static site generator with React supporting SSR and disabled javascript. Might be an alternative to gatsby.

WebVim

Bertrand Chevrier presented his distribution of vim: webvim. It includes several plugins aimed at easing web development with vim, along with some configuration to make it even nicer.

Binary fun

Gonçalo Morais presented some rarely used binary operators supported by javascript. Really interesting stuff when you need high performance or want to reduce network traffic. A good reference is available on mdn.

An interesting use case which might be familiar to game developers is shown here.

But at the end, he said that we shouldn’t use these operators, for sanity’s sake!

Nuxt

Sebastien Chopin presented nuxt.js, a project inspired by next.js but using vue.js instead of React.

UI as pure functions of time

Thomas Belin presented cycle.js.

Sponsors

The sponsors stands

As usual, the sponsors took half of the room to show their products.

Adobe Phonegap sponsored the midday meal, thank you! We kept a cup.

GlobalCharger saved the day with their mobile chargers. A good idea that we would like to see at all conferences.

The business guys from GitHub were at DotJS to advertise GitHub Entreprise and spread stickers to the world.

Finally, we met some Opbeat techies who came from Denmark for the conference. It was fun to talk with them!

Conclusion

We had not the opportunity to attend to all the conferences, we especially missed Evan You for his conference about Vue.js, which will have virtual dom in its next version.

This year, there were conferences for beginners and for node experts, interesting for most of them. The lightning talks were a lot of advertisement for companies or products with much less quality but have few tips and tricks. Most likely a better year than 2014.

We hope that we’ll dig further on Service Worker, babel-preset-env or Next.js on this very blog!

Photo credits: dotJS 2016 - Flickr album

comments powered by Disqus