What’s New in Chrome 24

It’s been six months since I last wrote about new features in Google Chrome. The browser has been evolving steadily and enticing new users but there was rarely anything exciting to report.

Chrome 24 was released a couple of days after Firefox 18. You probably didn’t notice the automated update but there are a number of interesting features for web developers…

MathML Support

Mathematical Markup Language is an XML schema which describes mathematical notations and formula. It produces results which are similar to Microsoft Office Equation Editor or the Math application in OpenOffice / LibreOffice.

Until MathML, you’d have required a graphic to produce an equation such as:

It can now be coded:

<math mode="display" xmlns="https://www.w3.org/1998/Math/MathML">
  <mrow>
    <mi>x</mi>
    <mo>=</mo>
    <mfrac>
      <mrow>
        <mo form="prefix">−</mo>
        <mi>b</mi>
        <mo>±</mo>
        <msqrt>
          <msup>
            <mi>b</mi>
            <mn>2</mn>
          </msup>
          <mo>−</mo>
          <mn>4</mn>
          <mo>⁢</mo>
          <mi>a</mi>
          <mo>⁢</mo>
          <mi>c</mi>
        </msqrt>
      </mrow>
      <mrow>
        <mn>2</mn>
        <mo>⁢</mo>
        <mi>a</mi>
      </mrow>
    </mfrac>
  </mrow>
</math>

MathML is now available in Chrome, Safari, Firefox and has partial support in Opera. No sign of implementation in IE yet. I suspect SVG may be an easier cross-browser alternative for some time to come.

IndexedDB Support

IndexedDB is a client-side data storage technology. While we already have key-value pairs in localStorage and sessionStorage, IndexedDB provides greater data structure and indexing support. It’s the approved successor to the Web SQL Database which never became an agreed W3C specification.

IndexedDB requires an article in itself, but the technology has become more viable now it’s supported in Chrome, Firefox and IE10. It’s likely to appear in Safari since, like Chrome, it uses the webkit engine. I’ve no doubt Opera are working on it. For more information, refer to the W3C IndexedDB Specification.

CSS Custom Filters

Custom Filters were suggested by Adobe and allow you to apply image or movie-like filter effects to any HTML content. Typical options include grayscale-to-color transitions, warping, animated shadows and more. In essence, it’s similar to SVG filters or Microsoft’s proprietary CSS filter property which was implemented in IE many, many years ago.

Chrome’s implementation is experimental, requires webkit prefixes and must be enabled in about:flags — see Enable CSS Shaders about two-thirds of way down. It looks exciting but don’t expect a reliable technology for year or two yet.

For more information, refer to the recent W3C Filter Effects specification and Adobe’s demonstration page.

Styled Logging

Chrome’s Developer Tools Console now supports styled logging using a syntax which is identical to that implemented in Firefox’s Firebug add-on. For example:

console.log("%cBlue text!", "color:blue;");

You can apply any CSS styles to highlight errors or other conditions.

It’s Faster

Chrome has always been fast, but the latest edition is faster than ever. In particular, Google claim better start-up times and report an overall improvement of more than 26% over the last year.

If you don’t believe them, try the new performance tab — chrome://performance/. You’ll need to enable performance monitoring in about:flags first.

Numerous Bug Fixes

More than 20 bugs have been squished in Chrome 24. In addition, $6,000 has been paid to developers who found high-severity vulnerabilities.

Chrome’s speed, stability and standards support has made it the browser to beat. It’s great to see that Google and the Webkit team have not become complacent. Long may it continue.