The WebKit project

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: bugﬁxing, features, new ports


The technology


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


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


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


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, ofﬂine &
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

WebKit Architecture

From a simpliﬁed 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-speciﬁc hooks to
implement generic algorithms


What is a WebKit port?


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


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

Architecture of a WebKit port


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..


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()


A minibrowser written in Python


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;
}


A minibrowser written in C


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


WebKit VS WebKit2


WebKit2 VS Chromium


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 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 ﬁles,
we have almost 1.5M LoC!

The Source Code in numbers

According to Ohloh on 2012 April 29th, ﬁles 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.


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/: speciﬁc 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


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, bugﬁxing)
Peter Beverloo (Google) reports are usually a good way to
follow what has happened lately: http://peter.sh/


The community


A bit of history

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


The WebKit Project in numbers

Commits per year (up to 2012 April 24th)



Commits per month (2011):



Commits per afﬁliations (2011)


WebKit Contributors

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


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.


Copyright for contributions

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


Releases

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


Coordination and communication tools

Website: http://www.webkit.org/
Port speciﬁc 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 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


How to contribute


Types of contributions

Bugﬁxing and new features in:
An existent port
The core components: webcore and JSC/V8

Creation and maintenance of a new port


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


Creating a port: what needs to be done

High level API (WebKit1 and WebKit2)
Low level backend speciﬁc implementation
Web Template Framework (WTF): memory management,
threading, data structures (vectors, hash tables, bloom
ﬁlters, ...) 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.


Creating a port: the social side

Difﬁcult 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-speciﬁc events and communication tools


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 deﬁned 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


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


The WebKit project

Recommended

More Related Content

What's hot (20)

Viewers also liked (20)

Similar to The WebKit project (20)

Recently uploaded (20)

The WebKit project