HTML 5 Application Cache device storage limits – Jan 2014

A large project I’m working on just now requires some offline capability so I’ve been doing a lot of research into the various HTML5 technologies available. One thing I found is that a lot of the information out there about storage limitations of browsers and devices was often quite old (2 years being quite old in this context!), so I’ve performed a range of tests to establish more up-to-date information, so as of Jan 2014 this is hopefully accurate!

Tests were performed using the AppCache test page at www.der-schepp.de/appcache-default-size/ apart from the Firefox results as that test page wouldn’t work at the time of testing, Firefox tests were performed using my own test page instead.

The tests were mostly performed using the online testing tool Browserstack, items marked with † indicate results when tested on actual devices or simulators / emulators.

Notable weird behaviour is on iOS devices where prompts to increase the available storage space to a limit of 50MB appear, however it seems that an actual limit of 16MB or 20MB occurs when running the test. Also note slightly weird behaviour with the IE10 and IE11 results on Windows RT.

Please leave comments if you see any different results than I have posted or if you have any additional results for devices.

* The AppCache test only tests a maximum of 256MB so ‘unlimited’ means at least 256MB can be stored. Please note that although limits are per each application cache manifest there is likely a maximum amount of storage space available which would limit how many much data overall can be stored, at this time I these limits are unknown but I hope to do some testing in this area in the near future.

Browser Version OS Platform Device Default max (0 = unlimited*, -1 = Unsupported) Max (with prompts) Comments
Internet Explorer 6,7,8 Win XP PC -1
Internet Explorer 9 Win 7 PC -1
Internet Explorer 9 Windows Phone 7.8 HTC HD7 -1
Internet Explorer 10 Win 7 PC 10 52
Internet Explorer 10 Win 8 PC 10
Internet Explorer 10 Desktop Win 8 PC 10 52
Internet Explorer 10 † Win 8 RT Surface RT V1 10 20 Prompt asking to “exceed the storage limit on your computer”. Interestingly using the ‘der-schepp.de’ test was giving 4MB as the default maximum here but using my own test confirmed 10MB which is what IE10’s default prompt level is set to. See notes for Win 8.1 RT tests.
Internet Explorer 10 Desktop † Win 8 RT Surface RT V1 10 20 Prompt asking to “exceed the storage limit on your computer”. Interestingly using the ‘der-schepp.de’ test was giving 2MB as the default maximum here but using my own test confirmed 10MB which is what IE10’s default prompt level is set to. See notes for Win 8.1 RT tests.
Internet Explorer 11 Win 7 PC 10 52
Internet Explorer 11 Win 8.1 PC 10 52
Internet Explorer 11 Desktop Win 8.1 PC 52
Internet Explorer 11 † Win 8.1 RT Surface RT V1 4 20 Prompt asking to “exceed the storage limit on your computer”. Interestingly using the ‘der-schepp.de’ test was giving 4MB as the default maximum here but using my own test 8MB was cached without a prompt appearing, IE 11 on Win RT 8.1 has 10MB set as the default level to prompt to exceed storage limits but trying 9MB or higher triggered the prompt.
Internet Explorer 11 Desktop † Win 8.1 RT Surface RT V1 4 20 Prompt asking to “exceed the storage limit on your computer”. Interestingly using the ‘der-schepp.de’ test was giving 4MB as the default maximum here but using my own test 8MB was cached without a prompt appearing, IE 11 on Win RT 8.1 has 10MB set as the default level to prompt to exceed storage limits but trying 9MB or higher triggered the prompt.
Safari 4.0 OSX 10.6 Mac 0
Safari 5.0 OSX 10.6 Mac 0
Safari 5.1 Win 8 PC 0
Safari 5.1 Win 8.1 PC 0
Safari 5.1 OSX 10.6 Mac 0
Safari 5.1 OSX 10.7 Mac 0
Safari 6.0 OSX 10.7 Mac 0
Safari 6.1 OSX 10.8 Mac 0
Safari 7.0 OSX 10.9 Mac 0
Chrome 31 Win XP PC 0
Chrome 31 Win 7 PC 128
Chrome 31 Win 8 PC 75
Chrome 31 Win 8.1 PC 0
Chrome 31 OSX 10.9 Mac 0
Chrome 32 Beta Win XP PC 0
Chrome 32 Beta Win 7 PC 0
Chrome 32 Beta Win 8 PC 56
Chrome 32 Beta Win 8.1 PC 0
Chrome 32 Beta OSX 10.8 Mac 0
Chrome 32 Beta OSX 10.9 Mac 0
Chrome 33 Dev Win XP PC 0
Chrome 33 Dev Win 7 PC 0
Chrome 33 Dev Win 8 PC 60
Chrome 33 Dev Win 8.1 PC 0
Chrome 33 Dev OSX 10.8 Mac 0
Chrome 33 Dev OSX 10.9 Mac 0
Mobile Chrome 31 – iPad † iOS 7.0 iPad 3rd Gen 20
Mobile Chrome 31 – iPhone † iOS 7.0 iPhone 5 20
Firefox 26 Win XP PC 0
Firefox 26 Win 7 PC 0 No prompt but instead gave a notification that the site was using over 50MB of storage.
Firefox 26 Win 8 PC 0 No prompt but instead gave a notification that the site was using over 50MB of storage.
Firefox 26 Win 8.1 PC 0 No prompt but instead gave a notification that the site was using over 50MB of storage.
Firefox 26 OSX 10.6 Mac 0 No prompt but instead gave a notification that the site was using over 50MB of storage.
Firefox 26 OSX 10.7 Mac 0 No prompt but instead gave a notification that the site was using over 50MB of storage.
Firefox 26 OSX 10.8 Mac 0 No prompt but instead gave a notification that the site was using over 50MB of storage.
Firefox 26 † OSX 10.9 Mac 0 No prompt but instead gave a notification that the site was using over 50MB of storage.
Firefox 27 Beta Win XP PC 0
Firefox 27 Beta Win 7 PC 0 No prompt but instead gave a notification that the site was using over 50MB of storage.
Firefox 27 Beta Win 8 PC 0 No prompt but instead gave a notification that the site was using over 50MB of storage.
Firefox 27 Beta Win 8.1 PC 0 No prompt but instead gave a notification that the site was using over 50MB of storage.
Firefox 27 Beta OSX 10.6 Mac 0 No prompt but instead gave a notification that the site was using over 50MB of storage.
Firefox 27 Beta OSX 10.7 Mac 0 No prompt but instead gave a notification that the site was using over 50MB of storage.
Firefox 27 Beta OSX 10.8 Mac 0 No prompt but instead gave a notification that the site was using over 50MB of storage.
Firefox 27 Beta OSX 10.9 Mac 0 No prompt but instead gave a notification that the site was using over 50MB of storage.
Firefox 26 for Android Android 4.1.2 Nexus S 20
Opera 18 Win XP PC 0
Opera 18 Win 7 PC 0
Opera 18 Win 8 PC 57
Opera 18 Win 8.1 PC 0
Opera 18 OSX 10.6 Mac 0
Opera 18 OSX 10.7 Mac 0
Opera 18 OSX 10.8 Mac 0
Opera 18 † OSX 10.9 Mac 0
Opera 19 Next Win XP PC 0
Opera 19 Next Win 7 PC 0
Opera 19 Next Win 8 PC 42
Opera 19 Next Win 8.1 PC 0
Opera 19 Next OSX 10.6 Mac 0
Opera 19 Next OSX 10.7 Mac 0
Opera 19 Next OSX 10.8 Mac 0
Opera 19 Next OSX 10.9 Mac 0
Opera 20 Dev Win XP PC 0
Opera 20 Dev Win 7 PC 0
Opera 20 Dev Win 8 PC 46
Opera 20 Dev Win 8.1 PC 0
Opera 20 Dev OSX 10.6 Mac 0
Opera 20 Dev OSX 10.7 Mac 0
Opera 20 Dev OSX 10.8 Mac 0
Opera 20 Dev OSX 10.9 Mac 0
Opera Mobile † Various Opera Mobile Emulator 0
BlackBerry Browser † BlackBerry 10 (10.2.0.1155) BlackBerry 10 Device Simulator 0
BlackBerry Playbook Browser † BlackBerry Playbook 2.1 (2.1.0.1032) BlackBerry PlayBook Device Simulator 0
Mobile Safari – iPad iOS 3.2 iPad 1st Gen 5
Mobile Safari – iPad iOS 4.3.2 iPad 2nd Gen 2 16 Prompts for 10MB, 25MB and 50MB appeared but the test only managed to store 16MB max.
Mobile Safari – iPad iOS 5.0 iPad 2nd Gen 2 20 Prompts for 10MB, 25MB and 50MB appeared but the test only managed to store 20MB max.
Mobile Safari – iPad iOS 5.1 iPad 3rd Gen 2 20 Prompts for 10MB, 25MB and 50MB appeared but the test only managed to store 20MB max.
Mobile Safari – iPad iOS 6.0 iPad 3rd Gen 10 16 Prompt for 25MB appeared but the test only managed to store 16MB max.
Mobile Safari – iPad iOS 6.0 iPad Mini 1st Gen 10 16 Prompts for 10MB, 25MB and 50MB appeared but the test only managed to store 16MB max.
Mobile Safari – iPad iOS 7.0 iPad 3rd Gen 10 16 Prompts for 10MB, 25MB and 50MB appeared but the test only managed to store 16MB max.
Mobile Safari – iPad † iOS 7.0 iPad 3rd Gen 10 16 Prompts for 10MB, 25MB and 50MB appeared but the test only managed to store 16MB max.
Mobile Safari – iPad † iOS 7.0 iPad Mini Retina 10 16 Prompts for 10MB, 25MB and 50MB appeared but the test only managed to store 16MB max.
Mobile Safari – iPhone iOS 3.0 iPhone 3GS 5
Mobile Safari – iPhone iOS 4.0 iPhone 4 5
Mobile Safari – iPhone iOS 5.1 iPhone 4S 2 20 Prompts for 10MB, 25MB and 50MB appeared but the test only managed to store 16MB max.
Mobile Safari – iPhone iOS 6.0 iPhone 4S 10 16 Prompts for 10MB, 25MB and 50MB appeared but the test only managed to store 16MB max.
Mobile Safari – iPhone iOS 6.0 iPhone 5 10 16 Prompts for 10MB, 25MB and 50MB appeared but the test only managed to store 16MB max.
Mobile Safari – iPhone † iOS 7.0 iPhone 5 10 16 Prompts for 10MB, 25MB and 50MB appeared but the test only managed to store 16MB max.
Mobile Safari – iPhone iOS 7.0 iPhone 5S 10 16 Prompts for 10MB, 25MB and 50MB appeared but the test only managed to store 16MB max.
Android Browser † Android 4.1.2 Nexus S 32
Amazon Silk 3.8 † Android 4.0.3 Kindle Fire 0
Android Browser Android 4.0.3 Kindle Fire 2 48
Amazon Silk 3.4 † Android 4.0.3 Kindle Fire HD 8.9 0
Android Browser Android 4.0.3 Kindle Fire HD 8.9 48
Android Browser Android 4.1.2 Google Nexus 7 10
Android Browser Android 4.0.4 Samsung Galaxy Note 10.1 10
Android Browser Android 4.0.4 Samsung Galaxy Tab 2 10.1 10
Android Browser Android 4.2.2 LG Nexus 4 8
Android Browser Android 4.1.2 Samsung Galaxy SIII 10
Android Browser Android 2.3.3 Samsung Galaxy Note 10

Download as a PDFDownload as a CSV

Creative Dundee Mid Week Meets –

We’ve been a bit starved of late in Dundee for any kind of creative meetups so it’s good to see that Creative Dundee are starting up the Mid Week Meets again.

Wednesday October 2nd is the date, Caffe Borsa, Panmure Street, Dundee, DD1 1ED (across from McManus) is the venue, 7-9pm is the time.

Tickets are free but places are limited, go to the event page on Creative Dundee to register on Event Brite for your ticket.

GoPro Hero 3 – 720p 120fps slowmo After Effects test

I have finally got myself a GoPro! This is a couple of test clips with footage shot in 720p 120fps mode on the GoPro Hero 3, then slowed down further in After Effects CS6 using Timestretch and Timewarp.

A bit glitchy due to the flickering from light behind it, I’ll try this again in bright daylight and compare results.

↵ Use original player
Vimeo
← Replay
X
i

R.I.P. BrowserLab

I wrote about BrowserLab here on Suburbia back when it launched in 2009, at the time it was one of very few web apps that let you preview websites in different browser / OS combinations. But things have moved on a lot since then with new services such as BrowserStack and Sauce which offer the much more compelling feature-set of being able to use live virtual machines accessed through your browser in order to use and test sites rather than just static screenshots.

BrowserLab has languished a bit for a while with very few desktop browser options and nothing to offer in the increasingly important areas of mobile and tablet device testing, in light of this Adobe seems to have decided that it’s better to kill it off instead of languish any further. Although some may be disappointed in this decision I had already ‘jumped ship’ and started using BrowserStack instead (as per my recent post) so it doesn’t affect my own workflow.

One bit of good news for those who enjoyed BrowserLab is that Sauce are offering a deal to BrowserLab users, for the next 30 days you can signup and get 10 free hours of testing, so go sign up for Sauce here and use ‘adobe’ as the promo code to get that offer.

I’ve just signed up for this myself and I’m going to try it out and see how it compares to BrowserStack, I can see a few differences between the two services already but I’m keen to see how the performance compares.

Cross-platform, cross-browser website testing with BrowserStack

Like many web design / developers I’ve made use of virtualisation applications like VirtualBox, Parallels Desktop and VMWare Fusion for Mac in order to test websites in the various versions of Internet Explorer. Using these apps requires buying the relevant Windows licences for the various virtual machines and also the overhead of keeping these current with the latest OS updates and browser / plugin updates too.

However, I recently did a fresh install of OSX on my Mac and decided just to remove all of the virtual machines due to the amount of space they used and had every intention of installing them all fresh and continuing to work that way. But due to project demands at work I had no time to do it and decided to look around for alternative ways to do some testing as I needed to do it for a project. I had previously used Adobe’s BrowserLab tool for quick static testing for layout issues in browsers but I needed something that let me browse sites and actually interact with the pages, and that’s where BrowserStack fits the bill perfectly.

How does BrowserStack work?

BrowserStack lets you connect to browsers running in virtual machines but directly through your browser, a bit like connecting to a machine via remote desktop. There are basically three steps to testing a site:

1.) Select the OS version you want:

BrowserStack's Operating System choices menu

2.) Choose from the available web browsers from that platform:

BrowserStack's Browser choices menu

3.) Enter the url of the site you want to test and hit the "Start testing" button:

BrowserStack's URL entry fields screen

The connection is then made to the virtual machine and rendered via the Flash plugin in your browser allowing you to interact with the site remotely, you can then easily choose from different OS and / or browser versions and then hit the "Update" button in the left hand menu and it will automatically grab the current url you are browsing and open that using your desired selection.

This how the site is viewed within BrowserStack:

Preview of site within BrowserStack

Overall it’s just a really easy to use system and lets you switch between different OS / browser variations much more quickly and with much less system overhead than using locally installed virtual machines.

It’s worth weighing up and pointing out some of the pros and cons of BrowserStack, there are few issues that might still cause you to choose running local virtual machines instead:

Pros:

  • You can run any OS you want on there including Win XP, Win 7, Win 8, OSX 10.6 Snow Leopard, OSX 10.7 Lion, OSX 10.8 Mountain Lion as well as mobile tablet OS / Browsers iOS, Android and Opera.
  • Quick to load up OS / Browser options.
  • Low overhead on your computer compared to running one or more VMs natively.
  • Developer tools such as FireBug installed on all browsers.
  • No new OS licences to purchase.
  • No OS updates or browser update hassles.
  • Low cost (from $19 per month for single user)

Cons

  • No Linux OS / Browser options.
  • You only get one browser option at a time, so if you’re using Win 7 with IE9 and want to test Firefox you need to select Firefox from the browser list and hit "Update" to initialise a fresh connection with only that browser.
  • Slow refresh rate for moving / animated content so it’s not great if you want to preview how well videos or animations run on your desired test platform. This is probably the biggest reason you may wish to test on local VMs instead.

So, that’s a basic overview of BrowserStack, but the best thing to do of course is try it yourself using the free trial which gives you 30 minutes (non-consecutive) to try out the full system.

Remotely debugging mobile devices: Remote web inspection in Safari and iOS6

It doesn’t take a genius to note that mobile devices are pretty much overtaking the web, and that a huge amount of people – the majority depending on the statistics you pay attention to – are accessing the web via a mobile device such as an iPhone, iPad or other smartphone / tablet.

As such there has been a huge buzz about responsive design and how to make sites adapt well between a range of screen sizes and resolutions, and moving away from the concept of a fixed size of screen such as the ubiquitous 960 pixel grid framework. One of the biggest challenges in this new era of web design and development has been the lack of good tools to aid you in the process of creating responsive, adaptive websites.

Media Queries and Responsive Design

The ability to work in code and create media queries to handle various device widths and related styles has been possible for a while, but it can be a bit mind-melting trying to keep track of all of this and to test as you work through the development process. Fortunately we are now beginning to see a range of tools to help you develop responsive sites, one of the most recent being Adobe’s new Edge Reflow tool which is an app that lets you visually adjust the viewport and tweak the CSS of various media queries. It’s a simple, focused app that lets you resize the viewport and tweak the styles as you go. At the time of writing it hasn’t been released yet but when I get a chance I will definitely be checking it out and writing something about it.

Remotely Debugging Code on Mobile Devices

Another challenge with working with mobile devices is that you really need to test on actual mobile devices to get an understanding of the true behaviour of them. Although you can set the width of your desktop browser to be the same as that of an iPhone it won’t necessarily behave exactly the same way due to the differences in the way the browsers handle CSS or JavaScript.

One of the difficulties in testing on devices themselves is that it’s not very easy to debug when things don’t work as expected. On a desktop browser such as Safari you can use the Web Inspector to see the live code as you interact with it and also see any JavaScript errors that are triggered, but on a mobile browser there is often little available to help you detect the errors.

Thankfully there are now tools being developed to allow remote access to the code running on the device itself, Adobe developed a tool codenamed ‘Shadow’ (now formally released as Edge Inspect) which works by providing apps for various mobile devices such as iPhone, iPad, Android phones and tablets.

With these apps installed on your devices you then run a desktop app on your computer as well as an extension in Google Chrome. You can then view websites in Chrome and they will be simultaneously displayed on the mobile devices running the apps, but the key feature is that you can remotely inspect the HTML, CSS and JavaScript running in the app on those devices. A really excellent tool.

Remotely Debugging in Safari

Adobe Edge Inspect (formerly Shadow) is a great tool, but what if, like me, you prefer to work in desktop Safari as your main browser and don’t want to or can’t use Chrome to test sites? In case anyone thinks this is just down to a matter of personal preference of browser I can give a legitimate example of why having to use Chrome can be a problem – Chrome’s in-built support for Flash gets in the way of testing content that is intended as fallback or alternative content on the desktop.

Screenshot of Web Inspector settings in iOS6 on an iPhoneFortunately the recent release of iOS6 offers a new feature that enables remote web inspection of mobile Safari on iPhone or iPad.

To make use of it you need to go into the ‘Settings’ app on your iOS device, and drill down into ‘Safari->Advanced’ where you’ll find a new toggle button for ‘Web inspector’, (this replaces the old ‘Debug’ option in mobile Safari which really offered little functionality).

Switch this on and you’ll see a small paragraph of text appearing which explains that you need to connect your device to your computer with a cable for this feature to work.

Once you’ve enabled Web Inspector on your iOS device(s) then you should find them listed in the Develop menu in Safari on your computer, it should looks something like this:

You can select the device and then it opens up a menu showing the available applications that web inspector can open. Note that you need to have mobile Safari open on your iOS device for any sites to be listed in the menu, if they’re not open then you’ll get a message saying ‘No Inspectable Applications’.

Once you select a site from the menu then the familiar Web Inspector window in Safari on your computer will open, the difference is that you are seeing the HTML, CSS and JavaScript from your iOS device. You can then browse around and interact with the site on your iOS device and inspect all of the changes occurring right in Web Inspector. Here’s a view of the HTML from a site on my iPhone:

Debugging via the console remotely

Just as with the ‘regular’ web inspector you can interact, view and update HTML and CSS and then see these temporary tweaks appear right on your iOS device. The main benefit in debugging for me has been in dealing with JavaScript / jQuery code, I can make use of console.log messages and debug via the console just as I would when working on my computer:

In a recent jQuery mobile based site I was developing I encountered code that was failing in mobile Safari but working fine in Safari on my Mac – exactly the kind of situation I mentioned earlier in this article where code is handled differently in mobile Safari. But thanks to this new remote web inspector functionality I was able to easily add some console messages and figure out what was going on and adjust the code to work around the problem.

A Great Solution for iOS Web Development and Testing

iOS6’s remote web inspection functionality is definitely a huge improvement if you are making sites that you need to test on iOS devices. With the increase in Android-based devices such as Google’s Nexus 7 and Amazon’s Kindle Fire tablets you will of course need to test on other devices besides iPhones and iPads. So tools like Adobe’s Edge Inspect are definitely something you will need to make use of too for testing across the various platforms and devices, but the simplicity of this iOS-specific testing workflow is very easy to set up and work with. A definite two-thumbs up from me!

I’m going to take a look at some of the other tools available to aid in the contemporary web development workflow of responsive, mobile-friendly design and write some more posts about them soon. In particular an updated look at Adobe’s Edge Animate tool and also a look at the Edge Reflow tool once it has been released.

Tip: Fix for iPhone voicemail stopping working after upgrading to iOS6

Along with a gazillion other people around the Globe I upgraded my iPhone to the new iOS 6 software that just came out, everything worked fine during the upgrade but afterwards both myself and my work colleague found that our iPhone voicemail no longer worked.

In this case my iPhone is on the UK’s Orange network (soon to be known as EE) which along with every other carrier apart from O2 doesn’t give you the nice Visual Voicemail the way that Apple intended. Instead voicemail is accessed just like any other mobile phone since the 1990’s by pressing a voicemail button which then dials a number and you then access the voicemail by pressing numbers on the keypad.

However, I couldn’t even get that far, tapping the voicemail button just came up with an error messaging saying that voicemail was not configured and to get in touch with the phone company (or words to that effect). I looked up some support forums for Orange and on the Apple site but didn’t find anything recent relating to iOS6 but I did come up with something from a while ago which seems to have done the trick!

First you need to find out what the actual number is that you need to call to access voicemail, for Orange this is simply ‘123’. The next and final step is to enter the following sequence into the phone dialer on your iPhone but making sure to substitute the ‘123’ in my example for whatever the number is for your phone service’s voicemail:

**5005*86*123#

Just enter that and hit dial, the screen should flash quickly and after that your voicemail should now be working! If it doesn’t then you’re probably best either contacting your phone operator or visiting an Apple Store. But hopefully it will fix it!

Bonus News – Visual Voicemail coming to EE:

A bonus bit of news I discovered whilst I was googling for a solution is that apparently EE (according to their Twitter account) are going to add visual voicemail to their service in the new year, so Orange and T-Mobile customers should hopefully get that on their iPhones in future.

Adobe Edge Preview 5

I wrote a post "My thoughts on Adobe Edge" back in August last year which looked at Edge Preview 1 where I was mainly interested in seeing how the output of Edge compared with Flash in capability, size and efficiency.

Since then Adobe have been regularly updating the Preview releases for Edge and have just released Adobe Edge Preview 5, since the initial Preview 1 release – which was pretty bare bones in regard to functionality – they have added a lot of new functionality.

In particular two things I’m pleased to see in Preview 5 are "Publish to Web" which brings code minification and "Down-level Stage for non-HTML5 Browsers" which provides a way to set fallback content for non-HTML5 browsers:

  • Publish to Web — Optimize your content for deployment by specifying if jQuery should be packaged with the composition, or downloaded from a CDN to improve caching.Edge also transforms the _edge.js file, and minifies both the _edge.js and _edgeActions.js files, resulting in significantly smaller files.
  • Down-level Stage for non-HTML5 Browsers — Use the new down-level stage to design static (non-animated) compositions that are compatible with older non-HTML5 browsers such as Internet Explorer 8 and below.

It’s good to see the minification capabilities added as this definitely helps deal with the size issue that I highlighted in my Preview 1 post. I think there’s probably still a load of work to do in minimising file sizes as this is especially important for mobile devices.

I’m keen to see what new features are added in future Preview releases, one issue is in regard to responsive web layouts and how content created in Edge can possibly adapt to the dimensions of the device / browser window that it is viewed in, again for mobile access this is very important.

One other feature that would be very good is some way to reproduce the masking capabilities that is possible in Flash, in particular the ability to apply a non-square mask over some content. It is possible to clip content but this uses rectangular clipping by limiting the overflow of a containing div to be hidden. I can’t see how non-square cropping would be possible with the limitations of current CSS3 capabilities, I’d happily be proven wrong on this though.

Here’s a preview video published on Adobe TV which introduces the updated features in Beta 5: