View
2.976
Download
1
Category
Preview:
DESCRIPTION
Demos available on http://people.opera.com/andreasb/demos/demos_svgopen2011/ For a long time now, Opera has been committed to implementing SVG in its desktop and mobile browser products. Over the last year, we have been focused on improving the performance of our SVG implementation, while adding new features as well, including support for embedding SVG in HTML5. Our Opera Dragonfly debugger has matured as well and is now a powerful tool for debugging SVG on desktop as well as on mobile. In this presentation, I give a status update of Opera's SVG implementation and introduce some of the latest changes to our Opera Presto engine. I also show demos and practical examples of how SVG can be mixed with other technologies to create compelling web applications.
Citation preview
SVG in Opera’s desktop, mobile & TV browsers — edition 2011
@andreasbovens
Oslo, Norway
Developer Relations team
Chris Mills
Bruce Lawson Daniel Davis
Karl Dubost
Shwetank Dixit
Divya Manian
Luz Caballero
Tiffany Brown
Vadim Makeev Mike TaylorZi Bin CheahPatrick Lauke
Andreas Bovens
It’s been a busy year!
&
http://www.opera.com/browser/next/http://www.opera.com/browser/http://my.opera.com/desktopteam/
Opera Opera Next
0
100
200
300
400
10.60 11 11.10 11.50 12
HTML5test.com
& friends
346
http://caniuse.com/#compare=y&b1=opera+10.6&b2=opera+12
HTML5 parser:- support for new elements- standardized error handling- support for inline SVG
Improved painting performance- painting code on a diet- smarts to optimize for specific TV use cases, e.g. transforms on <g>s with lots of children
Improved painting performance- painting code on a diet- smarts to optimize for specific TV use cases, e.g. transforms on <g>s with lots of children
Also: special focus on hardware acceleration on TVs, set-top boxes, etc.
We now support text-overflow=ellipsison text and textArea elements...
Talking about TV use cases...
See also http://www.w3.org/2011/03/03-svg-minutes.html#item04
on desktop for WebGL, 2D canvas, SVG & other painting operations
Hardware acceleration
Opera Mobile for Android phones & tablets
http://m.opera.com/
speed, UI optimizations, standards support
http://m.opera.com/
No more checkerboard, fast panning- new way of rendering visible content- some shortcuts for speed optimization
http://m.opera.com/
No more checkerboard, fast panning- new way of rendering visible content*- some shortcuts for speed optimization
* we don’t make fully use of this for SVG yet though
http://m.opera.com/
No more checkerboard, fast panning- new way of rendering visible content*- some shortcuts for speed optimization**
* we don’t make fully use of this for SVG yet though** switching between bilinear and nearest-neighbor interpolation
bilinear interpolation for zoomed images already in the viewport
nearest neighbor interpolation for zoomed images that are pulled in from outside the viewport
http://m.opera.com/
When developing for mobile, look into using the viewport meta tag, @viewport to solve zooming and panning issues.
it’s CSS, so thiscan be used inside SVG files as well!
http://m.opera.com/
http://goo.gl/j6YwF
Optimizing your layout
for phones and tablets
using viewport and
media queriesAndreas Bovens - Opera Software
http://goo.gl/f303y
Opera Dragonfly
Opera Dragonfly 1.0 and 1.1 releases.Rich feature set for local and even remote SVG debugging.http://www.opera.com/dragonfly/documentation/
Test automationOperaDriver is part of Selenium 2 and uses the Scope interface (like Opera Dragonfly) to communicate directly with Opera from Java. http://code.google.com/p/selenium/wiki/OperaDriver
ExampleAutomated game testing using OperaDriver automating the “Inbox Attack” game.
DetailsLong video: http://goo.gl/2VseMShort video: http://goo.gl/iDNSE GitHub repo: http://goo.gl/yQ7b1
Thanks for listening :-)Any questions?
@andreasbovens
Thanks to ~yc for the wooden background: http://yc.deviantart.com/art/Wood-Rays-62468397
Recommended