Developments in the
Qt WebKit Integration
Introducing even closer integration with Qt
A few words about me


   Kenneth Rohde Christiansen

   Working at the Nokia Technology Institute, INdT in Brazil

   Inv...
What is Qt WebKit?




      To answer that we need to look at WebKit itself




                                         ...
Agenda


   A heads-up introduction to WebKit

   A look at the new goodies in Qt 4.6




                                ...
A heads-up intro to WebKit



                             5
What is WebKit


   WebKit is a contents rendering/editing engine

   It is not a browser;

   though you could make one u...
Industry Acceptance


                                Adobe
    Apple                RIM


               Nokia
          ...
Acceptance by Contents Providers


    Powers most mobile pages:

      Android, iPhone, Nokia S60

    The engine behind:...
Highly Standard Compliant


   It is highly standard compliant



          And it is being developed in the open




    ...
There exists many variations




    Qt based, GTK+ based, Google Chrome, Android...


    Most developed in WebKit trunk
...
Down in the details


    The “engines” that powers WebKit are:

      – WebCore
      – JavaScriptCore (optional)




   ...
Building blocks


    WebCore serves at a number of building blocks

                                   Painting/rendering...
Bringing the blocks together


    Qt WebKit provides an implementation of WebCore using Qt
    constructs:

    • QNetwor...
Wait, there is more...


    Qt WebKit also provides a very powerful and intuitive Qt-ish
    API


    All build on top o...
Wait, there is more...


    The API is not merely a Qt-ish version of Apple's API, but an API
    designed from the groun...
Reasons for choosing WebKit


   Why choose WebKit for Qt's web contents needs?

     We didn't want a browser, but compon...
Introducing WebKit in Qt 4.6



                               17
Lots a new stuff...


   Qt 4.6 comes packed with a new version of WebKit


   And brings many of the new HTML5 features f...
Web Workers


   Thread like support for Web Applications


   “API for running scripts in the background, independently o...
Speculative Loading


    Loads documents, scripts and style-info

    ahead of time



    Snappier Internet Experience

...
Faster JavaScript


    New ARM v5 and v7 JITs



    Fast JavaScript on more platforms!

    ARM v5 JIT sponsored by Noki...
We have not been sleeping either!




                                    22
Apart from new features provided by WebKit itself,
Qt developers and open source contributors have
been hard at work, addi...
Out top feature request




    We are proud to present to you

    Out most requested feature request!




              ...
Introducing the QWebElement




                              25
Introducing the QWebElement


   • Easy and advanced DOM manipulation

   • jQuery like API

   • Just one single class, l...
CSS Selectors

  QWebElement document = frame­>documentElement();
  /* Assume the document has the following structure:
  ...
Easy traversal


  frame­>setHtml("<html><body><p>First Paragraph</p><p>Second 
  Paragraph</p></body></html>");


  QWebE...
Plugin Management


   Introducing the QWebPluginDatabase



   Provides access to plugin information

   Specifies plugin...
QtScript


    This one is big!
                               API re-implemented ontop of JavaScriptCore

               ...
Symbian Series 60 support


    Bringing Qt and WebKit to your second favorite phone ;-)

    Experimental support, almost...
Flexibility, future direction


    Qt WebKit is very flexible

    Allows for substituting network access, for instance
 ...
Rich interfaces for embedded


    Qt's answer is the Graphics View

    • Allows for rich interfaces

    • Custom widget...
It all looks so bright


    Everything is great! ....



          ...until you want to use WebKit




                  ...
Graphics View integration


    Qt WebKit doesn't provide a way to easily use it with the
    Graphics View.



    Actual...
That is now part of the past!




               Introducing the QGraphicsWebView




                                    ...
Introducing the QGraphicsWebView


   • A feature-full brother of the QWebView

   • A QGraphicsWidget with fast scrolling...
Introducing the QGraphicsWebView


   It will be highly customizable

   • Draw ontop of whatever you want

   • Clip the ...
Introducing the QGraphicsWebView


   We are committed to improving this and respond to most
   common customer demands


...
Web Developers have not been forgotten




                                         40
More compliant!


   We now have the layout testing infrastructure up and
   running, resulting in less buggy and more com...
Web Inspector


   A great tool for developers to introspect and modify the DOM
   of a web page


   Now we provide a cla...
How to contact us
  • IRC channel #qtwebkit on freenode

  • Bug reporting at http://bugs.webkit.org

  • Talk with me her...
?        TIME FOR


    QUESTIONS

                    44
Upcoming SlideShare
Loading in...5
×

Developments in the Qt WebKit Integration

9,287

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
0 Comments
6 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
9,287
On Slideshare
0
From Embeds
0
Number of Embeds
36
Actions
Shares
0
Downloads
148
Comments
0
Likes
6
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 http://bugs.webkit.org • 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.

×