Servo inside (introduction to Servo’s DOM binding) Tetsuharu OHZEKI, Gecko Inside #6 (Feb 24, 2016)

About me • Tetsuharu OHZEKI (a.k.a @saneyuki_s) • Mozilla Committer (Level 3) as a volunteer contributor • Firefox developer, and Servo reviewer • My main work is Web client-side engineer at Shibuya • JavaScript, GUI Application architecture

No content

Rust is a systems programming language that runs blazingly fast, prevents segfaults, and guarantees thread safety. http://rust-lang.org/

Rust Language • Develop by Mozilla & community • It’s just like “Modern Redesigned C++” • Today’s Gecko try to use Rust in some area: • https://wiki.mozilla.org/Oxidation • e.g. MP4 metadata parser, URL parser, style system

No content

Servo • Written with Rust • By Mozilla Research • Parallelism, Power, Correctness, Concurrent programming • more details: https://github.com/servo/servo/wiki/Research

Servo’s key “tasks” • Constellation • Script • Layout • Paint • Compositor • Resource

script crate • The implementation of “DOM” and scripting • Binding with SpiderMonkey • Handle a web driver’s script execution (from Constellation)

Rust Object JS Object browser JS Engine

DOM lifecycle & JS binding • DOM needs a complex lifecycle management • good article about this area: http://steps.dodgson.org/b/ 2012/12/19/dom-and-gc-or-what-happend-at-eden/ • Other browser engines have an own garbage collector for this complexity • Cycle Collector (Gecko) • Oilpan GC (Blink) • Servo need not own GC in the browser side like other engines. • All lifecycle of Servo’s DOM object are managed by SpiderMonkey GC

How to connect with JSObject & Rust Object? • DOM Object has “Reflector” field as the first field. • Reflector stores a pointer to “wrapper” JS Object which corresponds to it. • JS Object has a pointer to Rust object which is corresponds to it. • JS Object stores the pointer in its “slot”.

Node Reflector handlers parent_node …… JSObject

Generate a glue code from WebIDL • By /components/script/dom/bindings/codegen/ BindingGen.py • Auto generate from WebIDL with special annotation • Methods, Property, JIT Information, Constants, etc • “Glue” code to connect a Rust world & JS world

[Abstract] interface Node : EventTarget { [Constant] readonly attribute unsigned short nodeType; [Pure] readonly attribute DOMString nodeName; … }

No content

How to trace object graph from SpiderMonkey GC • From GC roots, SpiderMonkey GC trace an object graph. • Remember these simple rules: • From a wrapper object (JSObject), GC can traces a Rust Object. • From a Rust Object, GC can trace a wrapper JS Object. • Some compiler plugins helps these tricks ;)

Reflector JSObject Rust Object JS JS Reflector Rust Object JSObject JS Reflector Rust Object JSObject

GC Managed pointer • We use a special smart pointer for GC managed object in Rust world • JS can be holden as a member of a Rust’s DOM struct • Root can be on stack with rooting explicitly. • To avoid SpiderMonkey exact (precise) GC’s mistake. • In practice, we use this for a return value.

Inheritance • DOM interface requires an inheritance • But Rust does not have a inheritance system as a language feature! • So we generate annotation traits for safe up/down casting from WebIDL information! • …..And write vtable by hand!

No content

No content

vtable by hand…

Special macros and plugins • It’s hard to implement a GC hook for an object correctly. • We use a special rust compiler plugins to check & avoid typical pitfalls. • auto generate a tricky implementation for GC interaction. • check unrooted object • valid order of struct (for inheritance) • etc…

How to start hacking Servo? • http://servo.github.io/servo-starters/ • Servo team picks up “Good First Pull Request” • CONTRIBUTING.md • HACKING_QUICKSTART.md