FEATURED STORY

JavaScript shares its ubiquity

WebAssembly changes the rules of the JavaScript game.

engineroom

I’ve never seen a technology lay down its primary advantage and prepare to hand over its ubiquity. I’m proud of JavaScript for doing this, and I’m sure that in the long run this will be good for the Web, but in the meantime I’m wondering where WebAssembly will take us.

Brendan Eich’s announcement of the effort makes clear that this builds on the earlier asm.js (and Google’s similar PNaCl), a highly efficient JavaScript subset that compilers of other languages could target. Eich enjoyed using Unreal Engine for demos of the speed asm.js could provide, but compiling to JavaScript, even weird JavaScript, still needed to go through a JavaScript parser. (Other approaches compiled to more comprehensible but less optimized JavaScript.)

WebAssembly – wasm – skips that final step, producing a binary format, technically a compressed AST encoding. Unless you’re going to be building compilers, you can compare wasm to a bytecode system. There is a text format for debugging, but the binary emphasis yields substantial extra speed as it skips parsing and minimizes decompression.
Read more…

Comment: 1

Defining front-end architecture

Raising the banner for a new discipline.

frontend_architecture

In this excerpt taken from the upcoming book, Front-End Architecture: A Modern Blueprint for Scalable and Sustainable Design Systems, Micah Godbolt details the history of this new discipline and explains why it is such a vital role to embrace in our industry.

With the evolution of the web came changes to the roles of the modern web team. We went from a small group of generalist webmasters to a team of talented specialists. As each of these specialties developed, and members became more proficient in them, the web began to form a new set of roles… or disciplines.

Read more…

Comment: 1

The power of connection

URLs are the Web's unique superpower.

iron_chain_620
Over the past two decades, the heart of the Web has come to seem ordinary, forgettable. Some software has gone so far as to bury it and make it invisible, but it still worked its magic behind the scenes. As competing systems have made it disappear, though, absence has made many hearts grow fonder.

The humble URL is pretty ugly. The Web’s creator, Tim Berners-Lee, was embarrassed that people looked at them. It’s plain text, the computing interface that came right after punchcards and switches. The openings are always verbose, with a long “http://” (or similar) preceding the actual place you want to go. Excessively abstract debates about URIs aside, automated systems’ fondness for opaque identifiers has made many URLs hideous piles of characters that only a lookup table could enjoy. (Are QR codes even uglier?)

Even done badly, however, the URL is perhaps the most powerful innovation in networking history. While prior systems (IP addresses, DNS, and similar) had let us connect computers, URLs let us connect people’s creations. URLs let us share other people’s ideas, and promote our own ideas. The power to say “this bit of text will (mostly) reliably get you this content today” is a basic feature fundamental to the Web’s triumph.
Read more…

Comment: 1

Add depth to your project with practical web audio

Enhance the user experience with the thoughtful use of sound.

web_audio_header

There is little debate that Web Audio is cool. Take for example Stepkit by Brent Jackson (embedded below).

It’s definitely a fun toy to play with, but most of us probably couldn’t think of how this might be relevant to our jobs. When I presented 8-bit game music with the Web Audio API at last year’s Fluent Conference, I readily admitted that it was intended to be purely fun rather than practical.

Recently I explored the idea of adding audio to web apps, but I think the big problem isn’t that web developers were unsure how to add audio to their app, but that they don’t think they should add audio to web apps. In this article, I’d like to make the case that you should be considering audio when designing your web application user interface.

Read more…

Comment: 1

CSS Grid Layout: The modern way of doing layout on the Web

The O'Reilly Radar Podcast: Rachel Andrew on modern Web layout, and Kyle Simpson defends JavaScript Coercion.

Windows_Roman_Boed_Flickr

Subscribe to the O’Reilly Radar Podcast to track the technologies and people that will shape our world in the years to come.

In this week’s episode of the Radar Podcast, O’Reilly’s Mac Slocum chats with Rachel Andrew, founder of edgeofmyseat.com, about CSS Grid Layout and the role responsive design is playing in emerging Web technologies.

In 2004, Andrew published The CSS Anthology: 101 Essential Tips, Tricks & Hacks. Through the years of revisions, she noted in the interview, not that much has changed; sure, we’ve moved on from Netscape 4, she said, but “the [layout] methods we’re using haven’t moved on much since I wrote that book, which is kind of terrifying.” This is why Andrew is so excited about CSS Grid Layout, which she sees as bringing Web layout into the modern day:

CSS Grid Layout is a new spec, an emerging spec. It originally came from Microsoft. In fact, there’s an early implementation of it in IE 10 and 11. It’s kind of moved on now. It’s really a specification for laying out Web pages and/or applications. It’s something that we haven’t really had up to now. The specs and the sort of things that we’re using for layout, things like float and so on, really are quite like hacks to get them to work. Developers have been working around this stuff for years. Grid, I’m quite excited about because it’s sort of the first time it feels like a really modern way of doing layout on the Web.

Read more…

Comment: 1

Finding new in the Web

Learning from the Fluent Conference.

At Fluent 2015, we brought together a variety of stories about front-end engineering – some technical, some social, some more intricately intertwined.

From the very first day, it was clear that React was the big technical story of the conference, taking the place that Angular (which is still clearly important!) had had the previous year. Tutorials and sessions were busy, and I kept hearing conversation about React. Sometimes it was “what is React supposed to do?” but other times people were talking about exciting corners of React Native or techniques for integrating React with a variety of frameworks.

React makes me happy because it solves the problem a lot of people didn’t quite realize they had. Suddenly they are very enthusiastic about stuff that used to be really annoying. The Document Object Model (DOM) has been the foundation of most of the interactive work on the web since 1998, but it wasn’t very much fun then. As developers really get deeper into these things, the DOM has not exactly been a crowd-pleaser. In some ways React is a wrapper for the DOM, and in many ways it’s a just a better way to interact with the document tree.

The other technical key this year was JavaScript, often specifically ECMAScript 6 (ES6), the latest release. Brendan Eich talked about a world in which compiling to JavaScript has become normal, and how that frees much of the future development of JavaScript and the Web. Even Dart, which many of us saw as an attempt to replace JavaScript, has a home in this world.
Read more…

Comment: 1