Developments in the Qt WebKit Integration


Published on

The Qt WebKit Integration provides a powerful framework to seamlessly integrate web technologies into future Maemo applications, where web content can interact with Qt components. This presentation introduces the QtWebKit APIs, the underlying engine and new features coming in future releases.

Presentation by Kenneth Christiansen held during the Maemo Summit 2009 in Amsterdam

Published in: Technology
  • Be the first to comment

No Downloads
Total Views
On Slideshare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

Developments in the Qt WebKit Integration

  1. 1. Developments in the Qt WebKit Integration Introducing even closer integration with Qt
  2. 2. A few words about me Kenneth Rohde Christiansen Working at the Nokia Technology Institute, INdT in Brazil Involved with WebKit for about a year Part of the Qt WebKit team 2
  3. 3. What is Qt WebKit? To answer that we need to look at WebKit itself 3
  4. 4. Agenda A heads-up introduction to WebKit A look at the new goodies in Qt 4.6 4
  5. 5. A heads-up intro to WebKit 5
  6. 6. What is WebKit WebKit is a contents rendering/editing engine It is not a browser; though you could make one using it 6
  7. 7. Industry Acceptance Adobe Apple RIM Nokia Sony-Ericsson Palm Google 7
  8. 8. Acceptance by Contents Providers Powers most mobile pages: Android, iPhone, Nokia S60 The engine behind: Google Chrome, Apple Safari 8
  9. 9. Highly Standard Compliant It is highly standard compliant And it is being developed in the open 9
  10. 10. There exists many variations Qt based, GTK+ based, Google Chrome, Android... Most developed in WebKit trunk 10
  11. 11. Down in the details The “engines” that powers WebKit are: – WebCore – JavaScriptCore (optional) 11
  12. 12. Building blocks WebCore serves at a number of building blocks Painting/rendering Network access Text handling Parsing Layouting etc... 12
  13. 13. Bringing the blocks together Qt WebKit provides an implementation of WebCore using Qt constructs: • QNetworkAccessManager for all network access • QPainter based painting • Phonon-based playback of HTML5 Audio/Video 13
  14. 14. Wait, there is more... Qt WebKit also provides a very powerful and intuitive Qt-ish API All build on top of JavaScriptCore and WebCore 14
  15. 15. Wait, there is more... The API is not merely a Qt-ish version of Apple's API, but an API designed from the ground up, using Qt principles. That said, it provides many things that other WebKit variations don't 15
  16. 16. Reasons for choosing WebKit Why choose WebKit for Qt's web contents needs? We didn't want a browser, but components for integrating web technologies, where we and our customers see fit 16
  17. 17. Introducing WebKit in Qt 4.6 17
  18. 18. Lots a new stuff... Qt 4.6 comes packed with a new version of WebKit And brings many of the new HTML5 features found in Apple Safari 4 and Google Chome 18
  19. 19. Web Workers Thread like support for Web Applications “API for running scripts in the background, independently of any user interface scripts” Long-lived, high start-up cost, high per-instance memory cost. 19
  20. 20. Speculative Loading Loads documents, scripts and style-info ahead of time Snappier Internet Experience 20
  21. 21. Faster JavaScript New ARM v5 and v7 JITs Fast JavaScript on more platforms! ARM v5 JIT sponsored by Nokia and ARM 21
  22. 22. We have not been sleeping either! 22
  23. 23. Apart from new features provided by WebKit itself, Qt developers and open source contributors have been hard at work, adding new features to our Qt API 23
  24. 24. Out top feature request We are proud to present to you Out most requested feature request! 24
  25. 25. Introducing the QWebElement 25
  26. 26. Introducing the QWebElement • Easy and advanced DOM manipulation • jQuery like API • Just one single class, lots of possibilities • Represents a tree-like structure of DOM elements 26
  27. 27. CSS Selectors QWebElement document = frame­>documentElement(); /* Assume the document has the following structure:    <p class=intro>       <span>Intro</span>       <span>Snippets</span>    </p>    <p>    <span>Content</span>    <span>Here</span>    </p> */ QList<QWebElement> allSpans = document.findAll("span"); QList<QWebElement> introSpans = document.findAll("p.intro span"); 27
  28. 28. Easy traversal frame­>setHtml("<html><body><p>First Paragraph</p><p>Second  Paragraph</p></body></html>"); QWebElement doc = frame­>documentElement(); QWebElement body = doc.firstChild(); QWebElement firstParagraph = body.firstChild(); QWebElement secondParagraph = firstParagraph.nextSibling(); 28
  29. 29. Plugin Management Introducing the QWebPluginDatabase Provides access to plugin information Specifies plugin precidence Enable/disable plugins as you see fit 29
  30. 30. QtScript This one is big! API re-implemented ontop of JavaScriptCore Super fast QtScript execution with JIT Support More standard compliant Will power the future Qt declarative UI format Works on all platforms that supports QtScript in Qt 4.5 30
  31. 31. Symbian Series 60 support Bringing Qt and WebKit to your second favorite phone ;-) Experimental support, almost there Committed to S60 support for Qt 4.6 final 31
  32. 32. Flexibility, future direction Qt WebKit is very flexible Allows for substituting network access, for instance accessing data in a zip file as it was a network connection All building on top of the Qt framework 32
  33. 33. Rich interfaces for embedded Qt's answer is the Graphics View • Allows for rich interfaces • Custom widgets • Animation and rotation • And soon, a declarative UI format, built ontop of the Graphics View. 33
  34. 34. It all looks so bright Everything is great! .... ...until you want to use WebKit 34
  35. 35. Graphics View integration Qt WebKit doesn't provide a way to easily use it with the Graphics View. Actually, it is very tied to the QWidget way of life 35
  36. 36. That is now part of the past! Introducing the QGraphicsWebView 36
  37. 37. Introducing the QGraphicsWebView • A feature-full brother of the QWebView • A QGraphicsWidget with fast scrolling • Similar API as QWebView, but modified to fit better with the Graphics system and with scripting 37
  38. 38. Introducing the QGraphicsWebView It will be highly customizable • Draw ontop of whatever you want • Clip the corners, make them rounded • Use a different handler for “Browse files”, combo boxes etc, via the use of delegates 38
  39. 39. Introducing the QGraphicsWebView We are committed to improving this and respond to most common customer demands “Only your imagination will be the limit” ;-) 39
  40. 40. Web Developers have not been forgotten 40
  41. 41. More compliant! We now have the layout testing infrastructure up and running, resulting in less buggy and more comformant WebKit port. This has already resulted in many fixes to font spacing, shadows, etc. 41
  42. 42. Web Inspector A great tool for developers to introspect and modify the DOM of a web page Now we provide a class for controlling the inspector from C++. It can be used as a QWidget and is easy embeddable 42
  43. 43. How to contact us • IRC channel #qtwebkit on freenode • Bug reporting at • Talk with me here at the conference! 43
  44. 44. ? TIME FOR QUESTIONS 44
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.