SlideShare a Scribd company logo
The WebKit project
        Juan J. Sánchez
   LinuxCon 2012, San Diego
Myself, Igalia and WebKit



     Co-founder of the company, member of the
     WebKit/Browsers team
     Igalia is an open source consultancy founded in 2001
     Igalia is the main contributor to upstream WebKit after
     Google and Apple
     We work with some of the main IT industry actors
     integrating different WebKit solutions in their frameworks




                   The WebKit project   Juan J. Sánchez
Outline




     The technology: goals, features, architecture, code
     structure, ports, webkit2, ongoing work
     The community: contributors, committers, reviewers,
     tools, events
     How to contribute: bugfixing, features, new ports




                   The WebKit project   Juan J. Sánchez
The technology




 The WebKit project   Juan J. Sánchez
The WebKit project



     Web browser engine (HTML, JavaScript, CSS...)
     The engine is the product
     Started as a fork of KHTML and KJS in 2001
     Open Source since 2005
     Among other things, it’s useful for:
         Web browsers
         Using web technologies for UI development




                   The WebKit project   Juan J. Sánchez
Goals of the project

     Web Content Engine: HTML, CSS, JavaScript, DOM
     Open Source: BSD-style and LGPL licenses
     Compatibility: regression testing
     Standards Compliance
     Stability
     Performance
     Security
     Portability: desktop, mobile, embedded...
     Usability
     Hackability

                   The WebKit project   Juan J. Sánchez
Goals of the project



  NON-goals:
     “It’s an engine, not a browser”
     “It’s an engineering project not a science project”
     “It’s not a bundle of maximally general and reusable code”
     “It’s not the solution to every problem”

     http://www.webkit.org/projects/goals.html




                    The WebKit project   Juan J. Sánchez
WebKit features

     HTML and XML support
     JavaScript support (ECMAScript 5.1, ES6 in progress)
     CSS 2.1, CSS 3 support. Working drafts also
     SVG support
     Support for Plugins (NPAPI, WebKit Plugins)
     HTML5 support: multimedia, 3D graphics, advanced CSS
     animations and transformations, drag’n’drop, offline &
     local storage, connectivity...
     Accessibility support
     Q&A infrastructure: review process, continuous
     integration, 30.000 regression tests, API tests...
     Passing ACID3 with 100/100 tests since March 2008
                    The WebKit project   Juan J. Sánchez
WebKit Architecture

  From a simplified point of view, WebKit is structured this way:

                                   WebKit: thin layer to link against
                                   from the applications
                                   WebCore: rendering, layout,
                                   network access, multimedia,
                                   accessibility support...
                                   JS Engine: the JavaScript engine.
                                   JavaScriptCore by default, but can
                                   be replaced (e.g. V8 in Chromium)
                                   platform: platform-specific hooks to
                                   implement generic algorithms


                    The WebKit project   Juan J. Sánchez
What is a WebKit port?




               The WebKit project   Juan J. Sánchez
How many WebKit ports are there?

  WebKit is currently available for different platforms:
      GTK+ based platforms (GNOME)
      Qt based platforms (KDE, Meego)
      Mac OS X, iOS
      Google Chromium / Chrome
      Enlightenment Foundation Libraries (EFL)
      Symbian devices (S60)
      Adobe Integrated Runtime (Adobe AIR)
      BlackBerry
      WebOS
      Brew MP
      Win32 (Windows CE)
      wxWidgets

                     The WebKit project   Juan J. Sánchez
Some WebKit based browsers

   Amazon Kindle                                 PS3 web browser
   Arora                                         RockMelt
   BOLT browser                                  Safari
   Epiphany browser                              SRWare Iron
   Google Chrome                                 Shiira
   iCab (version >= 4)                           Sputnik for MorphOS
   Iris Browser                                  Stainless
   Konqueror                                     Steel for Android
   Midori                                        TeaShark
   Nintendo 3DS                                  Uzbl
   OWB                                           Web Browser for S60 (Nokia)
   OmniWeb                                       WebOS Browser
                    The WebKit project   Juan J. Sánchez
Architecture of a WebKit port




                The WebKit project   Juan J. Sánchez
Architecture of a WebKit port




                The WebKit project   Juan J. Sánchez
How do we use a WebKit port?

     The WebView widget:
     A platform-specific widget that renders web content.
     It’s the main component and it’s useful for:
         Loading URIs or data buffers pointing to HTML content
         Go fullscreen, text/text+image zooming...
         Navigate back and forward through history...

     Events handling:
     Allows embedders to get notified when something
     important happens or when some input is needed.
     Some examples of these events:
         Getting notified when a load finished or failed
         Asking permission for navigating to an URI
         Requesting authorization for something..


                   The WebKit project   Juan J. Sánchez
A minibrowser written in Python

  #!/usr/bin/env python
  # -*- coding: utf-8 -*-

  import gtk
  import webkit

  def entry_activated_cb(entry, embed):
      embed.load_uri(entry.get_text())

  # Widgets and signals
  window = gtk.Window()
  window.set_default_size(800, 600)
  window.set_title("Mini browser written in Python")
  embed = webkit.WebView(); # WebKit embed
  entry = gtk.Entry()
  entry.connect(’activate’, entry_activated_cb, embed)
  scroller = gtk.ScrolledWindow()
  scroller.add(embed)

  # Pack everything up and show
  vbox = gtk.VBox(False, 5)
  vbox.pack_start(entry, False, False)
  vbox.pack_start(scroller)
  window.add(vbox)
  window.show_all()

  # Load a default URI and run
  embed.load_uri("http://www.webkit.org")
  gtk.main()



                            The WebKit project   Juan J. Sánchez
A minibrowser written in Python




               The WebKit project   Juan J. Sánchez
A minibrowser written in C
  #include <webkit/webkit.h>
  static void entry_activated (GtkEntry *entry, WebKitWebView *embed)
  {
    webkit_web_view_load_uri (embed, gtk_entry_get_text (entry));
  }
  int main (int argc, char** argv)
  {
    gtk_init (&argc, &argv);

      /* Widgets and signals */
      GtkWidget *window = gtk_window_new (GTK_WINDOW_TOPLEVEL);
      gtk_window_set_default_size (GTK_WINDOW (window), 800, 600);
      gtk_window_set_title (GTK_WINDOW (window), "Mini browser written in C");
      GtkWidget *embed = webkit_web_view_new();
      GtkWidget *entry = gtk_entry_new();
      g_signal_connect (entry, "activate", G_CALLBACK (entry_activated), embed);
      GtkWidget *scroller = gtk_scrolled_window_new(NULL, NULL);
      gtk_container_add (GTK_CONTAINER(scroller), embed);

      /* Pack everything and show */
      GtkWidget *vbox = gtk_box_new (GTK_ORIENTATION_VERTICAL, 0);
      gtk_box_pack_start (GTK_BOX(vbox), entry, FALSE, FALSE, 0);
      gtk_box_pack_start (GTK_BOX(vbox), scroller, TRUE, TRUE, 0);
      gtk_container_add (GTK_CONTAINER(window), vbox);
      gtk_widget_show_all (window);

      /* Load a default URI and run */
      webkit_web_view_load_uri (WEBKIT_WEB_VIEW (embed), "http://www.webkit.org");
      gtk_main();
      return 0;
  }


                             The WebKit project   Juan J. Sánchez
A minibrowser written in C




               The WebKit project   Juan J. Sánchez
What is WebKit2?


     New API layer designed to support a split process model.
     Different to Chromium’s multi-process implementation
              It’s bundled in the framework (reusable)

     Different processes take care of different tasks:
         UI process: the WebView widget, application UI
         Web process: loading, parsing, rendering, layout...
         Plugin process: each plugin type in a process

     It comes with Inter-Process Communication (IPC)
     mechanisms to communicate those processes bundled-in

        http://trac.webkit.org/wiki/WebKit2



                    The WebKit project   Juan J. Sánchez
WebKit VS WebKit2




             The WebKit project   Juan J. Sánchez
WebKit2 VS Chromium




             The WebKit project   Juan J. Sánchez
WebKit2: current status



     Apple and Qt already released WebKit2 browsers
     WebKit2 stable API for the GTK+ port released, browser
     released soon
     Cross-platform and non-blocking C API available
     Most challenges of the split process model solved
     Tests running, need to deploy more test bots
     Still not considered “production quality”. Getting there




                   The WebKit project   Juan J. Sánchez
The Source Code in numbers
  According to Ohloh on 2012 April 29th, lines of code per
  language, without considering blank lines nor comments:

  Language          LoC         %
     HTML         1404469   33.79 %
         C++      1268231   30.51 %
  JavaScript      692274    16.65 %
        XML       254224     6.12 %
 Objective-C      101658     2.45 %
        PHP        97114     2.34 %
     Python        82366     1.98 %
         Perl      75677     1.82 %
         CSS       73587     1.77 %
           C       68469     1.65 %
  Other (19)       38820     0.93 %
        Total     4156889


                    https://www.ohloh.net/p/WebKit/analyses

                Just considering C++, Objective-C and C files,
                          we have almost 1.5M LoC!
                            The WebKit project   Juan J. Sánchez
The Source Code in numbers

  According to Ohloh on 2012 April 29th, files per license:



    License     Files      %
 BSD License    4427    51.09 %
 GNU LGPL       3568    41.18 %
        MPL      607    7.01 %
   Other (9)      63    0.73 %
        Total   8665




                  https://www.ohloh.net/p/WebKit/analyses


  New WebKit code will always be under the terms of either the
  LGPL 2.1+ or the BSD license. Never GPL or LGPL 3.


                          The WebKit project   Juan J. Sánchez
High Level source code overview

     Source/: the code needed to build WebKit. That is,
     WebCore, JavaScriptCore, WebKit and WebKit2
     LayoutTests/: layout tests reside here (More than 27000!).
     They test the correctness of WebKit features
     ManualTests/: specific cases not covered by automatic
     testing
     PerformanceTests/: measure run-time performance and
     memory usage
     See webkit-perf.appspot.com for results
     Tools/: tools and utilities for WebKit development.
     Small test applications, tools for testing, helper scripts...
     Websites/: code and pages for WebKit related sites

                    The WebKit project   Juan J. Sánchez
Tracking ongoing work in WebKit


     Webkit is a big beast and a lot of organizations with
     different agendas are working in different parts:

         Implementing new standards (like the CSS shaders from
         Adobe, or CSS3 GCPM from Apple)
         Improvements in architecture, performance and internal
         code (WebKit2)

     On top of this there is the maintenance work (testing,
     continuous integration, bugfixing)
     Peter Beverloo (Google) reports are usually a good way to
     follow what has happened lately: http://peter.sh/




                   The WebKit project   Juan J. Sánchez
The community




 The WebKit project   Juan J. Sánchez
A bit of history




      Source: http://ariya.ofilabs.com/2011/11/
      one-hundred-thousand-and-counting.html



                   The WebKit project   Juan J. Sánchez
The WebKit Project in numbers

  Commits per year (up to 2012 April 24th)




                    The WebKit project   Juan J. Sánchez
The WebKit Project in numbers

  Commits per month (2011):




                  The WebKit project   Juan J. Sánchez
The WebKit Project in numbers


  Commits per affiliations (2011)




                   The WebKit project   Juan J. Sánchez
WebKit Contributors




  As of 2012 April 24th, we have in WebKit:
      Contributors: >370 people
      Committers: 212 people
      Reviewers: 110 people




                    The WebKit project   Juan J. Sánchez
Committers and Reviewers


  WebKit Committer
  A WebKit Committer should be a person we can trust to follow and
  understand the project policies about checkins and other matters.

         Has commit rights to the public SVN repository.



  WebKit Reviewer
  A WebKit Reviewer should be a person who has shown particularly
  good judgment, understanding of project policies, collaboration skills,
  and understanding of the code.

      A WebKit Committer who can review other’s patches.



                       The WebKit project   Juan J. Sánchez
Copyright for contributions




     There is no copyright transfer for the contributions
     Committers sign some papers where they commit to good
     behaviour




                   The WebKit project   Juan J. Sánchez
Releases




     There are no releases of WebKit itself
     Each port manages the release cycle, typically aligned with
     the target platform schedule




                   The WebKit project   Juan J. Sánchez
Coordination and communication tools

     Website: http://www.webkit.org/
       Port specific Websites (e.g. http://webkitgtk.org/)
     Wiki: http://trac.webkit.org/wiki
     Blogs: http://planet.webkit.org/
     Source Code:
         SVN: http://svn.webkit.org/repository/webkit
         Git mirror: git://git.webkit.org/WebKit.git

     Bugzilla: https://bugs.webkit.org/
     Buildbots: http://build.webkit.org/
     Mailing lists: http://lists.webkit.org/mailman/listinfo.cgi
     IRC (irc.freenode.net): #webkit and #webkitgtk+

                    The WebKit project   Juan J. Sánchez
The WebKit Contributors Meeting




     Meeting for contributors to the WebKit project
     Organized in an “unconference”-like format
     Extremely useful to advance on some topics:
     Implementation of new APIs, WebKit2, accelerated
     compositing, helper tools, QA infrastructure...
     Yearly held in Cupertino, California. Hosted by Apple




                   The WebKit project   Juan J. Sánchez
How to contribute




  The WebKit project   Juan J. Sánchez
Types of contributions




     Bugfixing and new features in:
         An existent port
         The core components: webcore and JSC/V8

     Creation and maintenance of a new port




                   The WebKit project   Juan J. Sánchez
Guidelines for contributing patches to WebKit

   1   Get and build the code from the SVN repository
   2   Choose or create a bug report to work on
   3   Code your changes and make sure you include new
       regression or unit tests if needed
   4   Create a patch for your changes and submit it asking for
       review over it to appropriate reviewers
   5   Update and change your patch as many times as needed
   6   Once approved, land your patch or ask a
       committer/reviewer to do it
   7   Watch for any regressions it might have caused


                     The WebKit project   Juan J. Sánchez
Creating a port: what needs to be done

     High level API (WebKit1 and WebKit2)
     Low level backend specific implementation
         Web Template Framework (WTF): memory management,
         threading, data structures (vectors, hash tables, bloom
         filters, ...) numerical support, etc.
         JSC vs V8
         Networking: HTTP, DNS, cookies, etc.
         Graphics: 2D/3D rendering, compositing, theming, fonts
         Multimedia: media player for audio and video tags
         DOM bindings
         Accessibility
         Smaller tasks: clipboard, popup and context menus,
         cursors, etc.

     Other things: favicons, plugins, downloads, geolocation,
     settings, navigation policies, etc.

                   The WebKit project   Juan J. Sánchez
Creating a port: the social side



      Difficult without full-time reviewers
      Reuse from other ports as much as possible
      Try to work upstream from the very beginning
      The risk of forking is big, the project moves fast
      Focus on testing and continuous integration
      Port-specific events and communication tools




                     The WebKit project   Juan J. Sánchez
Conclusions


     WebKit: an Open Source web engine powering lots of
     applications (not only browsers!) out there
     The only true Open Source alternative for embedders
     Clearly defined and modular architecture. Port friendly
     Complex and fast moving project
     Developed by a community of organizations and
     individuals with different interests, collaborating together
     Lots of contributors. Appropriate policies in place to
     handle permissions and responsibilities in the project




                   The WebKit project   Juan J. Sánchez
Thank you!
      Juan J. Sánchez
  jjsanchez@igalia.com




The WebKit project   Juan J. Sánchez

More Related Content

PDF
Physical Memory Management.pdf
PDF
Mobile Browser Internal (Blink Rendering Engine)
PDF
Android Chromium Rendering Pipeline
PDF
PPTX
Implementing a JavaScript Engine
PDF
Mavenの真実とウソ
PDF
Web Development Workshop (Front End)
PDF
実践に向けたドメイン駆動設計のエッセンス
Physical Memory Management.pdf
Mobile Browser Internal (Blink Rendering Engine)
Android Chromium Rendering Pipeline
Implementing a JavaScript Engine
Mavenの真実とウソ
Web Development Workshop (Front End)
実践に向けたドメイン駆動設計のエッセンス

What's hot (20)

PDF
Tailwind CSS - KanpurJS
PDF
PPTX
Static partitioning virtualization on RISC-V
PDF
[KubeCon EU 2020] containerd Deep Dive
PDF
1.mysql disk io 모니터링 및 분석사례
PDF
Android OS Porting: Introduction
PDF
[125]웹 성능 최적화에 필요한 브라우저의 모든 것
PPTX
Node.js Express
PDF
Android Boot Time Optimization
PPTX
Redisの特徴と活用方法について
PDF
Android IPC Mechanism
PDF
実践的な設計って、なんだろう?
PDF
Introduction to Android Window System
PDF
Rootless Containers
PDF
Docker Introduction
PDF
ドメイン駆動設計の捉え方 20150718
PPTX
Virtualization, Containers, Docker and scalable container management services
PDF
Intégration continue et déploiement continue avec Jenkins
PPTX
Docker: From Zero to Hero
PDF
Git Introduction Tutorial
Tailwind CSS - KanpurJS
Static partitioning virtualization on RISC-V
[KubeCon EU 2020] containerd Deep Dive
1.mysql disk io 모니터링 및 분석사례
Android OS Porting: Introduction
[125]웹 성능 최적화에 필요한 브라우저의 모든 것
Node.js Express
Android Boot Time Optimization
Redisの特徴と活用方法について
Android IPC Mechanism
実践的な設計って、なんだろう?
Introduction to Android Window System
Rootless Containers
Docker Introduction
ドメイン駆動設計の捉え方 20150718
Virtualization, Containers, Docker and scalable container management services
Intégration continue et déploiement continue avec Jenkins
Docker: From Zero to Hero
Git Introduction Tutorial
Ad

Viewers also liked (20)

PDF
WebKit and Blink: Bridging the Gap Between the Kernel and the HTML5 Revolution
PDF
Browser history and overview
PDF
Understanding Webkit Rendering
PPTX
Web browser architecture
PDF
Guides To Analyzing WebKit Performance
PDF
Hardware Acceleration in WebKit
PDF
Chromium on Wayland Desktop (BlinkOn 7)
PPT
Chromium vs. Firefox
PDF
WebKit and GStreamer
PDF
Architecture of the Web browser
PPT
KIẾN TRÚC CẬN ĐẠI
PDF
8A- Bioseguridad
PPTX
Duomo di Milano - Arquitectura Gótica - IV CICLO - Sosa Castillo Carlo André
PPSX
Derecho civil de los bienes sesiones i, ii, iii
PDF
La corrupción en mexico
PDF
Recetas para principiantes
PPT
Exposicion Producto 3D
PPT
A apologia de sócrates
PDF
World Quality Report 2013 14
PPT
A un olmo seco.alicia y sara
WebKit and Blink: Bridging the Gap Between the Kernel and the HTML5 Revolution
Browser history and overview
Understanding Webkit Rendering
Web browser architecture
Guides To Analyzing WebKit Performance
Hardware Acceleration in WebKit
Chromium on Wayland Desktop (BlinkOn 7)
Chromium vs. Firefox
WebKit and GStreamer
Architecture of the Web browser
KIẾN TRÚC CẬN ĐẠI
8A- Bioseguridad
Duomo di Milano - Arquitectura Gótica - IV CICLO - Sosa Castillo Carlo André
Derecho civil de los bienes sesiones i, ii, iii
La corrupción en mexico
Recetas para principiantes
Exposicion Producto 3D
A apologia de sócrates
World Quality Report 2013 14
A un olmo seco.alicia y sara
Ad

Similar to The WebKit project (20)

PDF
The WebKit project (LinuxCon North America 2012)
PDF
WebKit and Blink: Open Development Powering the HTML5 Revolution (LinuxCon No...
PDF
WebKit and Blink: Bridging the Gap Between the Kernel and the HTML5 Revolutio...
PDF
WebKit and Blink: open development powering the HTML5 revolution
PDF
Developments in the Qt WebKit Integration
PDF
Building a browser for automotive. alternatives, challenges and recommendatio...
PDF
Building a Browser for Automotive: Alternatives, Challenges and Recommendations
PPTX
WebKit, why it matters?
PDF
WebKit2 And You (GUADEC 2013)
PDF
WebKit, why it matters (PDF version)
PDF
Add the power of the Web to your embedded devices with WPE WebKit
PDF
Hybrid Apps (Native + Web) using WebKit
PDF
Hybrid Apps (Native + Web) using WebKit
PDF
Hybrid Apps (Native + Web) via QtWebKit
PDF
Browsers and Web Runtimes for Automotive: Alternatives, Challenges, and Curre...
PDF
Igalia and WebKit: Status update and plans
PDF
2021 WebKit Contributors Meeting, Igalia
PDF
Introduction to QtWebKit
PDF
Igalia and WebKit: Status update and plans
KEY
Phonegap for Engineers
The WebKit project (LinuxCon North America 2012)
WebKit and Blink: Open Development Powering the HTML5 Revolution (LinuxCon No...
WebKit and Blink: Bridging the Gap Between the Kernel and the HTML5 Revolutio...
WebKit and Blink: open development powering the HTML5 revolution
Developments in the Qt WebKit Integration
Building a browser for automotive. alternatives, challenges and recommendatio...
Building a Browser for Automotive: Alternatives, Challenges and Recommendations
WebKit, why it matters?
WebKit2 And You (GUADEC 2013)
WebKit, why it matters (PDF version)
Add the power of the Web to your embedded devices with WPE WebKit
Hybrid Apps (Native + Web) using WebKit
Hybrid Apps (Native + Web) using WebKit
Hybrid Apps (Native + Web) via QtWebKit
Browsers and Web Runtimes for Automotive: Alternatives, Challenges, and Curre...
Igalia and WebKit: Status update and plans
2021 WebKit Contributors Meeting, Igalia
Introduction to QtWebKit
Igalia and WebKit: Status update and plans
Phonegap for Engineers

Recently uploaded (20)

PDF
Building Integrated photovoltaic BIPV_UPV.pdf
PDF
Bridging biosciences and deep learning for revolutionary discoveries: a compr...
PDF
Mobile App Security Testing_ A Comprehensive Guide.pdf
PDF
Modernizing your data center with Dell and AMD
PDF
Architecting across the Boundaries of two Complex Domains - Healthcare & Tech...
PPT
Teaching material agriculture food technology
PPTX
Digital-Transformation-Roadmap-for-Companies.pptx
PDF
cuic standard and advanced reporting.pdf
PDF
How UI/UX Design Impacts User Retention in Mobile Apps.pdf
PPTX
Big Data Technologies - Introduction.pptx
PDF
Chapter 3 Spatial Domain Image Processing.pdf
PPTX
Cloud computing and distributed systems.
PDF
Peak of Data & AI Encore- AI for Metadata and Smarter Workflows
PDF
Machine learning based COVID-19 study performance prediction
PDF
Shreyas Phanse Resume: Experienced Backend Engineer | Java • Spring Boot • Ka...
DOCX
The AUB Centre for AI in Media Proposal.docx
PDF
Build a system with the filesystem maintained by OSTree @ COSCUP 2025
PDF
Electronic commerce courselecture one. Pdf
PDF
NewMind AI Monthly Chronicles - July 2025
PDF
KodekX | Application Modernization Development
Building Integrated photovoltaic BIPV_UPV.pdf
Bridging biosciences and deep learning for revolutionary discoveries: a compr...
Mobile App Security Testing_ A Comprehensive Guide.pdf
Modernizing your data center with Dell and AMD
Architecting across the Boundaries of two Complex Domains - Healthcare & Tech...
Teaching material agriculture food technology
Digital-Transformation-Roadmap-for-Companies.pptx
cuic standard and advanced reporting.pdf
How UI/UX Design Impacts User Retention in Mobile Apps.pdf
Big Data Technologies - Introduction.pptx
Chapter 3 Spatial Domain Image Processing.pdf
Cloud computing and distributed systems.
Peak of Data & AI Encore- AI for Metadata and Smarter Workflows
Machine learning based COVID-19 study performance prediction
Shreyas Phanse Resume: Experienced Backend Engineer | Java • Spring Boot • Ka...
The AUB Centre for AI in Media Proposal.docx
Build a system with the filesystem maintained by OSTree @ COSCUP 2025
Electronic commerce courselecture one. Pdf
NewMind AI Monthly Chronicles - July 2025
KodekX | Application Modernization Development

The WebKit project

  • 1. The WebKit project Juan J. Sánchez LinuxCon 2012, San Diego
  • 2. Myself, Igalia and WebKit Co-founder of the company, member of the WebKit/Browsers team Igalia is an open source consultancy founded in 2001 Igalia is the main contributor to upstream WebKit after Google and Apple We work with some of the main IT industry actors integrating different WebKit solutions in their frameworks The WebKit project Juan J. Sánchez
  • 3. Outline The technology: goals, features, architecture, code structure, ports, webkit2, ongoing work The community: contributors, committers, reviewers, tools, events How to contribute: bugfixing, features, new ports The WebKit project Juan J. Sánchez
  • 4. The technology The WebKit project Juan J. Sánchez
  • 5. The WebKit project Web browser engine (HTML, JavaScript, CSS...) The engine is the product Started as a fork of KHTML and KJS in 2001 Open Source since 2005 Among other things, it’s useful for: Web browsers Using web technologies for UI development The WebKit project Juan J. Sánchez
  • 6. Goals of the project Web Content Engine: HTML, CSS, JavaScript, DOM Open Source: BSD-style and LGPL licenses Compatibility: regression testing Standards Compliance Stability Performance Security Portability: desktop, mobile, embedded... Usability Hackability The WebKit project Juan J. Sánchez
  • 7. Goals of the project NON-goals: “It’s an engine, not a browser” “It’s an engineering project not a science project” “It’s not a bundle of maximally general and reusable code” “It’s not the solution to every problem” http://www.webkit.org/projects/goals.html The WebKit project Juan J. Sánchez
  • 8. WebKit features HTML and XML support JavaScript support (ECMAScript 5.1, ES6 in progress) CSS 2.1, CSS 3 support. Working drafts also SVG support Support for Plugins (NPAPI, WebKit Plugins) HTML5 support: multimedia, 3D graphics, advanced CSS animations and transformations, drag’n’drop, offline & local storage, connectivity... Accessibility support Q&A infrastructure: review process, continuous integration, 30.000 regression tests, API tests... Passing ACID3 with 100/100 tests since March 2008 The WebKit project Juan J. Sánchez
  • 9. WebKit Architecture From a simplified point of view, WebKit is structured this way: WebKit: thin layer to link against from the applications WebCore: rendering, layout, network access, multimedia, accessibility support... JS Engine: the JavaScript engine. JavaScriptCore by default, but can be replaced (e.g. V8 in Chromium) platform: platform-specific hooks to implement generic algorithms The WebKit project Juan J. Sánchez
  • 10. What is a WebKit port? The WebKit project Juan J. Sánchez
  • 11. How many WebKit ports are there? WebKit is currently available for different platforms: GTK+ based platforms (GNOME) Qt based platforms (KDE, Meego) Mac OS X, iOS Google Chromium / Chrome Enlightenment Foundation Libraries (EFL) Symbian devices (S60) Adobe Integrated Runtime (Adobe AIR) BlackBerry WebOS Brew MP Win32 (Windows CE) wxWidgets The WebKit project Juan J. Sánchez
  • 12. Some WebKit based browsers Amazon Kindle PS3 web browser Arora RockMelt BOLT browser Safari Epiphany browser SRWare Iron Google Chrome Shiira iCab (version >= 4) Sputnik for MorphOS Iris Browser Stainless Konqueror Steel for Android Midori TeaShark Nintendo 3DS Uzbl OWB Web Browser for S60 (Nokia) OmniWeb WebOS Browser The WebKit project Juan J. Sánchez
  • 13. Architecture of a WebKit port The WebKit project Juan J. Sánchez
  • 14. Architecture of a WebKit port The WebKit project Juan J. Sánchez
  • 15. How do we use a WebKit port? The WebView widget: A platform-specific widget that renders web content. It’s the main component and it’s useful for: Loading URIs or data buffers pointing to HTML content Go fullscreen, text/text+image zooming... Navigate back and forward through history... Events handling: Allows embedders to get notified when something important happens or when some input is needed. Some examples of these events: Getting notified when a load finished or failed Asking permission for navigating to an URI Requesting authorization for something.. The WebKit project Juan J. Sánchez
  • 16. A minibrowser written in Python #!/usr/bin/env python # -*- coding: utf-8 -*- import gtk import webkit def entry_activated_cb(entry, embed): embed.load_uri(entry.get_text()) # Widgets and signals window = gtk.Window() window.set_default_size(800, 600) window.set_title("Mini browser written in Python") embed = webkit.WebView(); # WebKit embed entry = gtk.Entry() entry.connect(’activate’, entry_activated_cb, embed) scroller = gtk.ScrolledWindow() scroller.add(embed) # Pack everything up and show vbox = gtk.VBox(False, 5) vbox.pack_start(entry, False, False) vbox.pack_start(scroller) window.add(vbox) window.show_all() # Load a default URI and run embed.load_uri("http://www.webkit.org") gtk.main() The WebKit project Juan J. Sánchez
  • 17. A minibrowser written in Python The WebKit project Juan J. Sánchez
  • 18. A minibrowser written in C #include <webkit/webkit.h> static void entry_activated (GtkEntry *entry, WebKitWebView *embed) { webkit_web_view_load_uri (embed, gtk_entry_get_text (entry)); } int main (int argc, char** argv) { gtk_init (&argc, &argv); /* Widgets and signals */ GtkWidget *window = gtk_window_new (GTK_WINDOW_TOPLEVEL); gtk_window_set_default_size (GTK_WINDOW (window), 800, 600); gtk_window_set_title (GTK_WINDOW (window), "Mini browser written in C"); GtkWidget *embed = webkit_web_view_new(); GtkWidget *entry = gtk_entry_new(); g_signal_connect (entry, "activate", G_CALLBACK (entry_activated), embed); GtkWidget *scroller = gtk_scrolled_window_new(NULL, NULL); gtk_container_add (GTK_CONTAINER(scroller), embed); /* Pack everything and show */ GtkWidget *vbox = gtk_box_new (GTK_ORIENTATION_VERTICAL, 0); gtk_box_pack_start (GTK_BOX(vbox), entry, FALSE, FALSE, 0); gtk_box_pack_start (GTK_BOX(vbox), scroller, TRUE, TRUE, 0); gtk_container_add (GTK_CONTAINER(window), vbox); gtk_widget_show_all (window); /* Load a default URI and run */ webkit_web_view_load_uri (WEBKIT_WEB_VIEW (embed), "http://www.webkit.org"); gtk_main(); return 0; } The WebKit project Juan J. Sánchez
  • 19. A minibrowser written in C The WebKit project Juan J. Sánchez
  • 20. What is WebKit2? New API layer designed to support a split process model. Different to Chromium’s multi-process implementation It’s bundled in the framework (reusable) Different processes take care of different tasks: UI process: the WebView widget, application UI Web process: loading, parsing, rendering, layout... Plugin process: each plugin type in a process It comes with Inter-Process Communication (IPC) mechanisms to communicate those processes bundled-in http://trac.webkit.org/wiki/WebKit2 The WebKit project Juan J. Sánchez
  • 21. WebKit VS WebKit2 The WebKit project Juan J. Sánchez
  • 22. WebKit2 VS Chromium The WebKit project Juan J. Sánchez
  • 23. WebKit2: current status Apple and Qt already released WebKit2 browsers WebKit2 stable API for the GTK+ port released, browser released soon Cross-platform and non-blocking C API available Most challenges of the split process model solved Tests running, need to deploy more test bots Still not considered “production quality”. Getting there The WebKit project Juan J. Sánchez
  • 24. The Source Code in numbers According to Ohloh on 2012 April 29th, lines of code per language, without considering blank lines nor comments: Language LoC % HTML 1404469 33.79 % C++ 1268231 30.51 % JavaScript 692274 16.65 % XML 254224 6.12 % Objective-C 101658 2.45 % PHP 97114 2.34 % Python 82366 1.98 % Perl 75677 1.82 % CSS 73587 1.77 % C 68469 1.65 % Other (19) 38820 0.93 % Total 4156889 https://www.ohloh.net/p/WebKit/analyses Just considering C++, Objective-C and C files, we have almost 1.5M LoC! The WebKit project Juan J. Sánchez
  • 25. The Source Code in numbers According to Ohloh on 2012 April 29th, files per license: License Files % BSD License 4427 51.09 % GNU LGPL 3568 41.18 % MPL 607 7.01 % Other (9) 63 0.73 % Total 8665 https://www.ohloh.net/p/WebKit/analyses New WebKit code will always be under the terms of either the LGPL 2.1+ or the BSD license. Never GPL or LGPL 3. The WebKit project Juan J. Sánchez
  • 26. High Level source code overview Source/: the code needed to build WebKit. That is, WebCore, JavaScriptCore, WebKit and WebKit2 LayoutTests/: layout tests reside here (More than 27000!). They test the correctness of WebKit features ManualTests/: specific cases not covered by automatic testing PerformanceTests/: measure run-time performance and memory usage See webkit-perf.appspot.com for results Tools/: tools and utilities for WebKit development. Small test applications, tools for testing, helper scripts... Websites/: code and pages for WebKit related sites The WebKit project Juan J. Sánchez
  • 27. Tracking ongoing work in WebKit Webkit is a big beast and a lot of organizations with different agendas are working in different parts: Implementing new standards (like the CSS shaders from Adobe, or CSS3 GCPM from Apple) Improvements in architecture, performance and internal code (WebKit2) On top of this there is the maintenance work (testing, continuous integration, bugfixing) Peter Beverloo (Google) reports are usually a good way to follow what has happened lately: http://peter.sh/ The WebKit project Juan J. Sánchez
  • 28. The community The WebKit project Juan J. Sánchez
  • 29. A bit of history Source: http://ariya.ofilabs.com/2011/11/ one-hundred-thousand-and-counting.html The WebKit project Juan J. Sánchez
  • 30. The WebKit Project in numbers Commits per year (up to 2012 April 24th) The WebKit project Juan J. Sánchez
  • 31. The WebKit Project in numbers Commits per month (2011): The WebKit project Juan J. Sánchez
  • 32. The WebKit Project in numbers Commits per affiliations (2011) The WebKit project Juan J. Sánchez
  • 33. WebKit Contributors As of 2012 April 24th, we have in WebKit: Contributors: >370 people Committers: 212 people Reviewers: 110 people The WebKit project Juan J. Sánchez
  • 34. Committers and Reviewers WebKit Committer A WebKit Committer should be a person we can trust to follow and understand the project policies about checkins and other matters. Has commit rights to the public SVN repository. WebKit Reviewer A WebKit Reviewer should be a person who has shown particularly good judgment, understanding of project policies, collaboration skills, and understanding of the code. A WebKit Committer who can review other’s patches. The WebKit project Juan J. Sánchez
  • 35. Copyright for contributions There is no copyright transfer for the contributions Committers sign some papers where they commit to good behaviour The WebKit project Juan J. Sánchez
  • 36. Releases There are no releases of WebKit itself Each port manages the release cycle, typically aligned with the target platform schedule The WebKit project Juan J. Sánchez
  • 37. Coordination and communication tools Website: http://www.webkit.org/ Port specific Websites (e.g. http://webkitgtk.org/) Wiki: http://trac.webkit.org/wiki Blogs: http://planet.webkit.org/ Source Code: SVN: http://svn.webkit.org/repository/webkit Git mirror: git://git.webkit.org/WebKit.git Bugzilla: https://bugs.webkit.org/ Buildbots: http://build.webkit.org/ Mailing lists: http://lists.webkit.org/mailman/listinfo.cgi IRC (irc.freenode.net): #webkit and #webkitgtk+ The WebKit project Juan J. Sánchez
  • 38. The WebKit Contributors Meeting Meeting for contributors to the WebKit project Organized in an “unconference”-like format Extremely useful to advance on some topics: Implementation of new APIs, WebKit2, accelerated compositing, helper tools, QA infrastructure... Yearly held in Cupertino, California. Hosted by Apple The WebKit project Juan J. Sánchez
  • 39. How to contribute The WebKit project Juan J. Sánchez
  • 40. Types of contributions Bugfixing and new features in: An existent port The core components: webcore and JSC/V8 Creation and maintenance of a new port The WebKit project Juan J. Sánchez
  • 41. Guidelines for contributing patches to WebKit 1 Get and build the code from the SVN repository 2 Choose or create a bug report to work on 3 Code your changes and make sure you include new regression or unit tests if needed 4 Create a patch for your changes and submit it asking for review over it to appropriate reviewers 5 Update and change your patch as many times as needed 6 Once approved, land your patch or ask a committer/reviewer to do it 7 Watch for any regressions it might have caused The WebKit project Juan J. Sánchez
  • 42. Creating a port: what needs to be done High level API (WebKit1 and WebKit2) Low level backend specific implementation Web Template Framework (WTF): memory management, threading, data structures (vectors, hash tables, bloom filters, ...) numerical support, etc. JSC vs V8 Networking: HTTP, DNS, cookies, etc. Graphics: 2D/3D rendering, compositing, theming, fonts Multimedia: media player for audio and video tags DOM bindings Accessibility Smaller tasks: clipboard, popup and context menus, cursors, etc. Other things: favicons, plugins, downloads, geolocation, settings, navigation policies, etc. The WebKit project Juan J. Sánchez
  • 43. Creating a port: the social side Difficult without full-time reviewers Reuse from other ports as much as possible Try to work upstream from the very beginning The risk of forking is big, the project moves fast Focus on testing and continuous integration Port-specific events and communication tools The WebKit project Juan J. Sánchez
  • 44. Conclusions WebKit: an Open Source web engine powering lots of applications (not only browsers!) out there The only true Open Source alternative for embedders Clearly defined and modular architecture. Port friendly Complex and fast moving project Developed by a community of organizations and individuals with different interests, collaborating together Lots of contributors. Appropriate policies in place to handle permissions and responsibilities in the project The WebKit project Juan J. Sánchez
  • 45. Thank you! Juan J. Sánchez jjsanchez@igalia.com The WebKit project Juan J. Sánchez