As I noted in my previous post about Fronteers 2014 there were not as many talks about usable new techniques or tools as I would have liked. This doesn't mean that no interesting new terms were mentioned. That's why I will supply a list of the subjects that were new to me.
An interactive documentary about the ISEE-3 spacecraft. A Chrome experiment using WebGL.
CSS generator for CSS 3 keyframe animations at http://cssanimate.com/.
The experimental Dialog HTML element is a semantic element that can be used for e.g. modal dialogs. It's only supported in Chrome 37+ at the moment. Naming conventions around this common component are very unclear (modal, dialog, "popup" and backdrop, fade, "fog", overlay) so it would make a very useful addition, in my opinion. Check out this jsfiddle (Chrome only).
An overview of supported ES6 features for different platforms (polyfills, browsers, runtimes).
CSS generator for flexbox at http://the-echoplex.net/flexyboxes/.
API for accessing video/audio devices from the browser. See many demos here, e.g. a real-life color-picker. As noted in the talk, using https will allow for the browser to store the permission to access the multimedia devices. A very detailed tutorial can be found on html5rocks. In this tutorial getUserMedia is also combined with CSS filters to apply real-time effects to a video stream.
Rebuild by CERN of the original line-mode browser from 1992. See the line-mode browser.
A node module (with a grunt plugin and an online tool) to generate the critical path of CSS to speed up page rendering. The browser waits with displaying any page until the CSS is loaded or times out eventually, resulting in a blank page. Of course it is always recommendable to have the CSS combined and minified (and gzipped), but if performance is important it might be an option to load it inline (!) to prevent failing on bad connections.
The Shadow DOM lets you manipulate parts of an HTML document that are normally invisibly encapsulated within another HTML element. An example is styling the controls (play, rewind) of the video tag with CSS. This introduction shows some examples. It's part of webcomponents, allowing you to create custom components and hiding the contents in a shadow DOM. It also enables scoping of styles. I also made an example in this fiddle.
Grunt plugin to create a spritesheet. I use Compass' magic sprites to do this in Sass, but it might be useful if you want to use libsass or LESS.
SUIT CSS is a reliable and testable styling methodology for component-based UI development. It offers a.o. a naming convention, a pre-processor and CSS testing.
The Traceur compiler lets you write in ES6 syntax and compile it back to ES5 so you can use ES6 features in today's browers. According to the ES6 compatibility table it supports 63% of ES6 features at this moment.
CSS generator for CSS 3 linear and radial gradients at http://www.colorzilla.com/gradient-editor/.
Peer-to-peer connections in the browser, supported in FF and Chrome at the moment. Using the data channels, it was even possible to create a client-side streaming torrent client.
The CSS property "will-change" is a new feature (Chrome 36, FF 36) that can inform the browser beforehand that certain CSS animation may be applied to an element, helping with optimization. See the docs or this in-depth article on Sitepoint.
"Tiny but linear growing unique id generator." A function to create better cachebusting variables, now formalized as an NPM package.