Hot in web standards: May/June 2013

Fast vs complete selector profiles

In the beginning of May, CSS Selectors Level 4 was published as a new Working Draft (WD). A big difference from the previous WD was the introduction of the concept of two "Selector profiles": fast and complete. In the words of the spec:

"Selectors are used in many different contexts, with wildly varying performance characteristics. Some powerful selectors are unfortunately too slow to realistically include in the more performance-sensitive contexts. To accommodate this, two profiles of the Selectors spec are defined [...]"

If you’re wondering what kind of contexts could be performance-sensitive, and which ones aren't, here are a few examples:

• Regular CSS code is performance-sensitive because it needs to be re-evaluated very frequently (every time the page changes or is resized). Any delay is very noticeable
• A less performance-sensitive context: when CSS Selectors are evaluated once against the DOM structure, such as the Selectors API (document.querySelector etc)

Unfortunately, this means that several hyped new CSS selectors, will not be available in regular CSS code. One of those is the subject indicator, which offers a lot of powerful functionality, including a 'parent selector', a feature highly requested by developers. The subject indicator would allow us to do things like !a img which means 'An <a> tag which includes an image', whereas a regular a img means "An image which is inside an <a> tag". Traditionally in CSS selectors, the subject is always the last part.

<main> element moved to core HTML

In late 2012, we got a first public WD of a HTML5 extension specification that defined a <main> element. This has now been merged into the Core HTML 5.1 specification. This is great for its adoption because it means UAs can't conform to HTML 5.1 without supporting it.

SVG text wrapping

If you’ve ever tried to hand-code SVG, you've probably noticed a fairly significant limitation: there is no way to automatically wrap multiline text. Not only are the line breaks manual rather than automatic, there's also no concept of line breaks at all. Instead, each line needs to be wrapped in a <tspan> element and positioned separately.

Doug Schepers of W3C had been unhappy with this limitation for a long time, so he took the initiative of pushing for an easy way to wrap text, namely setting a width on the <text> element, and letting browsers applyexisting CSS wrapping context code to SVG text. He presented it in a recent SVG f2f meeting, detailed his own proposal, then blogged about it and promoted it on social media. This quickly got the SVG and CSS WGs to agree as well as number of browser developers, so expect to see it in a browser near you fairly soon.

Flexbox wins Best New Web Technology 2013 .net Award!

The annual .net awards are some of the most well-known awards in our industry. There are a number of categories and the winner is determined by a combination of public voting and a panel of judges. This year’s awards ceremony took place in late May in London and one of the winners was a W3C technology! Flexbox (aka CSS Flexible Box Layout), a CSS spec that aims to solve a number of incredibly common layout problems, won the "Best New Web Technology" award. Furthermore, the third runnerup was also a W3C specification, WebRTC, which will enable live voice and video chatting in your browser.

<hgroup> is dead, long live <subhead>!?

After endless debates between equally passionate opponents, the HTML WG resolved to remove <hgroup> from HTML5. Instead, a new section has been added: "Subheadings, subtitles, alternative titles and taglines" explains that "HTML does not have a dedicated mechanism for marking up subheadings, alternative titles or taglines", and suggests using <span>s or <p>s for them.

However, after <hgroup>’s demise, discussions about an appropriate element for subheadings sparked again. Steve Faulkner, an accessibilty advocate, wrote a proposal for a <subline> element, which later became a <subhead> element. Nobody knows what's going to happen, but there's a lot of discussion. If you have anything to add, feel free to weigh in.

FPWD of Raw Socket API

You may have heard about the Web Sockets API, which allows two-way communication with servers and facilitates real-time updates. In May, a new specification was published that defines a more low-level socket API that provides raw access to TCP and UDP sockets without the abstractions (and limitations) of the Web Sockets API.

Unless you have a networking background, this may sound like mumbo-jumbo to you. However, there are several fascinating use cases for this:

• An email client which communicates with SMTP, POP3 and IMAP servers
• An IRC client which communicates with IRC servers
• Implementing a SSH app
• Communicating with existing consumer hardware, like internet-connected TVs
• Game servers
• Peer-to-peer (P2P) applications
• Local network multicast service discovery, eg UPnP/SSDP and mDNS

(Source: System Applications WG: Raw Sockets API)

I’m especially excited about peer-to-peer applications, and email and IRC clients. These are all incredibly common things where plug-ins and/or backends were needed. Once this API is implemented in browsers, expect to see many amazing apps being created!

FPWD of CSS Shapes

A few days ago, a First Public Working Draft of CSS Shapes Level 1 was published, following the CSS WG’s decision to separate it from Exclusions.

CSS Shapes will enable designers to wrap text around — and in the future, inside too — any shape, even shapes derived from the transparency of SVG or bitmap images. This is a huge step towards CSS having the power to do layouts that graphic designers were able to make for a long time in DTP applications and was a highly requested CSS feature for a long time. You can read more about it, including quotes from yours truly and one of the editors of the spec, on a recent .net article, and learn more at Web Platform Docs.

FPWD of Messaging API

An interesting new API has been published as a First Public Working Draft. It’s called Messaging API and it will enable applications to send and receive SMS and MMS messages. This will be mostly useful in web-based mobile operating systems, like Firefox OS, but I could see it being useful in browsers as well.

Status updates

Besides the document status updates outlined above, there are several more that progressed in the past two months, such as:

• CSS Custom Properties for Cascading Variables (aka CSS Variables) went to Last Call (LC), so take a look and send feedback to www-style
• A new WD of CSS Masking was published on June 20
• A new WD of SVG 2 was published on June 18
• A new WD of Canvas 2D Context was published on May 28
• A new WD of CSS Regions was published on May 28
• A new WD of Filter Effects was published on May 23
• IndexedDB went into Last Call in May 16. Take a look and send any feedback to the WebApps WG
• A new WD of Media Capture and Streams was published on May 16
• The Page Visibility API reached Recommendation status and is now a standard
• On May 14, FPWDs were published for HTML Imports and Custom Elements, both parts of the Web Components Model
• Pointer Events became a Candidate Recommendation (CR) on May 9

June CSS WG F2F

On June 5-7, the CSS WG had its second face-to-face meeting this year in Tokyo, Japan. Unfortunately, I couldn't attend due to a speaking engagement. However, the meeting minutes for all three days of meetings are publicly available:

• June 5
• June 6
• June 7

Several decisions were made and many of the major ones have already been discussed above. If you are interested, you can read the minutes and find out about the rest as well.

Thanks to Doug Schepers for his feedback and corrections. Photo credit: Dave Raggett

Lea works as a developer advocate for the W3C. She has a long-standing passion for open web standards, which she fulfills by researching new ways to use them, blogging, speaking, writing, and coding popular open source projects to help fellow developers.