- asm.js: near-native performance on the web
- ECMAScript 6 (ES6): evolving the language, uniting the community
- Web Components: a standard infrastructure for widgets
- CSS Grid Layout: native-like GUI layout
Why it is exciting:
- Near-native speed in web browsers.
Why it is exciting: You get parallelism without any pitfalls. Plans for the future are impressive, too – ParallelJS may eventually produce code for GPUs.
- Classes: Currently, almost every framework has its own inheritance API, hindering code portability. With ECMAScript 6 classes, there is hope that everybody will eventually use the same mechanism.
- I’ve written many blog posts on ECMAScript 6, if you want to delve into details.
- The draft ECMAScript 6 specification is available as PDF and HTML, if you are feeling hard core.
Why it is exciting: Web Components will enable a common ecosystem for web widgets. In the present, you may come across an exciting widget on the web, only to find out that it doesn’t work with your framework of choice. In the future, that problem will hopefully go away, because all widgets will be Web Components and all frameworks will support Web Components. Then frameworks can focus on new ideas and don’t have to reinvent the foundational infrastructure wheel.
Google’s Polymer Project polyfills Web Components for current browsers. That means that the APIs can be polished via experience gained from real-world projects before becoming part of HTML5.
- “Web Components Resources” by Eric Bidelman
- Google’s Polymer and the future of web UI frameworks
CSS Grid Layout: native-like GUI layoutWhat it is: Quoting the standard:
This CSS module defines a two-dimensional grid-based layout system, optimized for user interface design. In the grid layout model, the children of a grid container can be positioned into arbitrary slots in a flexible or fixed predefined layout grid.
Why it is exciting: Desktop and mobile UI frameworks such as Android, iOS (Cocoa) and Java SWT are still ahead of the web when it comes to layouting graphical user interfaces. CSS Grid Layout will eliminate that gap. How about support in browsers? Internet Explorer already supports it, implementations in Firefox and Chrome are in progress. Here is hoping that it will be available on the latter two browsers in 2014. If you look at the editors of the spec, below, the signs are good.
Flexbox versus CSS Grid Layout: Flexbox is another CSS layouting mechanism, with broad support across browsers. It is great for fluid rows of HTML elements. When it comes to grids, it gets you quite far, because you can nest vertical and horizontal flexboxes. However, you have to decide on a dominant dimension (horizontal or vertical), making dynamic relationships in both dimensions impossible. In other words: true grids (as used for desktop-style graphical user interfaces) are easier in CSS Grid Layout.
- “CSS Grid Layout Module Level 1” by Tab Atkins Jr. (Google), fantasai (Mozilla), Rossen Atanassov (Microsoft)
- “Understanding the Difference between CSS3 Flexbox & Grid Layout” by Kyle Keeling (@kyle_keeling)
- “[Where] can I use CSS Grid Layout?” by Alexis Deveria (@Fyrd)