t parallel browser & program synthesisparlab.eecs.berkeley.edu/sites/all/parlab/files/the... ·...
TRANSCRIPT
![Page 1: T PARALLEL BROWSER & PROGRAM SYNTHESISparlab.eecs.berkeley.edu/sites/all/parlab/files/The... · Program Synthesis! 3 . Parallelism for Energy Efficiency Mobile Today 200 sites @ 4.5](https://reader034.vdocuments.us/reader034/viewer/2022050500/5f92cfcaa1f94e71fb5c6fc6/html5/thumbnails/1.jpg)
Leo Meyerovich, Thibaud Hottelier, Matthew Torok,
Eric Atkinson, Edward Lu, Ras Bodik
Seth Fowler (Mozilla), Chris Jones (Mozilla), Adam Jiang (Oracle)
James Ide (Facebook)
THE PARALLEL BROWSER
& PROGRAM SYNTHESIS
1
![Page 2: T PARALLEL BROWSER & PROGRAM SYNTHESISparlab.eecs.berkeley.edu/sites/all/parlab/files/The... · Program Synthesis! 3 . Parallelism for Energy Efficiency Mobile Today 200 sites @ 4.5](https://reader034.vdocuments.us/reader034/viewer/2022050500/5f92cfcaa1f94e71fb5c6fc6/html5/thumbnails/2.jpg)
2007: Future of the Browser? 1) Web on 1 Watt 2) Visualization
2
![Page 3: T PARALLEL BROWSER & PROGRAM SYNTHESISparlab.eecs.berkeley.edu/sites/all/parlab/files/The... · Program Synthesis! 3 . Parallelism for Energy Efficiency Mobile Today 200 sites @ 4.5](https://reader034.vdocuments.us/reader034/viewer/2022050500/5f92cfcaa1f94e71fb5c6fc6/html5/thumbnails/3.jpg)
Obstacle: Programmability
Parallel JavaScript
Parallel Browser Impl.
Parallel Browser APIs
Schedule? Data
representation?
Correctness?
Program Synthesis!
3
![Page 4: T PARALLEL BROWSER & PROGRAM SYNTHESISparlab.eecs.berkeley.edu/sites/all/parlab/files/The... · Program Synthesis! 3 . Parallelism for Energy Efficiency Mobile Today 200 sites @ 4.5](https://reader034.vdocuments.us/reader034/viewer/2022050500/5f92cfcaa1f94e71fb5c6fc6/html5/thumbnails/4.jpg)
Parallelism for Energy Efficiency
Mobile Today
200 sites @ 4.5 Watt-
Hours
4-8 cores x 128b SIMD
GPGPU (ARM Mali)
4
![Page 5: T PARALLEL BROWSER & PROGRAM SYNTHESISparlab.eecs.berkeley.edu/sites/all/parlab/files/The... · Program Synthesis! 3 . Parallelism for Energy Efficiency Mobile Today 200 sites @ 4.5](https://reader034.vdocuments.us/reader034/viewer/2022050500/5f92cfcaa1f94e71fb5c6fc6/html5/thumbnails/5.jpg)
Big Data Needs a Frontend
5
Analysis Result: No
![Page 6: T PARALLEL BROWSER & PROGRAM SYNTHESISparlab.eecs.berkeley.edu/sites/all/parlab/files/The... · Program Synthesis! 3 . Parallelism for Energy Efficiency Mobile Today 200 sites @ 4.5](https://reader034.vdocuments.us/reader034/viewer/2022050500/5f92cfcaa1f94e71fb5c6fc6/html5/thumbnails/6.jpg)
6
BIG
INTERACTIVE
VISUALIZATIONS
![Page 7: T PARALLEL BROWSER & PROGRAM SYNTHESISparlab.eecs.berkeley.edu/sites/all/parlab/files/The... · Program Synthesis! 3 . Parallelism for Energy Efficiency Mobile Today 200 sites @ 4.5](https://reader034.vdocuments.us/reader034/viewer/2022050500/5f92cfcaa1f94e71fb5c6fc6/html5/thumbnails/7.jpg)
What to Parallelize in the Browser?
parser
selector engine
12%
layout engine
renderer
JavaScript
29%
20%
23%
10%
“LaTeX”
“Game”
“Compiler”
7
![Page 8: T PARALLEL BROWSER & PROGRAM SYNTHESISparlab.eecs.berkeley.edu/sites/all/parlab/files/The... · Program Synthesis! 3 . Parallelism for Energy Efficiency Mobile Today 200 sites @ 4.5](https://reader034.vdocuments.us/reader034/viewer/2022050500/5f92cfcaa1f94e71fb5c6fc6/html5/thumbnails/8.jpg)
Parallel Browser System Design
Parser
Selectors
Layout
Renderer
HTML data CSS styling
JS script
Pixels
Java
Scri
pt
VM
8
4. automatic parallelization
1. parallel components
2. parallel event loop
3. multiple design expt’s
![Page 9: T PARALLEL BROWSER & PROGRAM SYNTHESISparlab.eecs.berkeley.edu/sites/all/parlab/files/The... · Program Synthesis! 3 . Parallelism for Energy Efficiency Mobile Today 200 sites @ 4.5](https://reader034.vdocuments.us/reader034/viewer/2022050500/5f92cfcaa1f94e71fb5c6fc6/html5/thumbnails/9.jpg)
4. automatic parallelization
Parallel Browser System Design
Parser
Selectors
Layout
Renderer
HTML data CSS styling
JS script
Pixels
Java
Scri
pt
VM
9
1. parallel components
2. parallel event loop
GPU** [Intel, Qualcomm, Mozilla,
Microsoft, Samsung]
[Intel, Qualcomm, Mozilla]
multicore*
multicore
multicore + SIMD
GPU
MIMD + GPU
[HotPar’09]
[WWW’10]
[PPOPP’13, HotPar’11]
[LASH-C’13]
[WWW’10, PPOPP’13]
1
2
3
4
5
6
1 2 3 4
spee
du
p
cores optimized baseline
0X
2X
4X
Av. Speedup
3. multiple designs
![Page 10: T PARALLEL BROWSER & PROGRAM SYNTHESISparlab.eecs.berkeley.edu/sites/all/parlab/files/The... · Program Synthesis! 3 . Parallelism for Energy Efficiency Mobile Today 200 sites @ 4.5](https://reader034.vdocuments.us/reader034/viewer/2022050500/5f92cfcaa1f94e71fb5c6fc6/html5/thumbnails/10.jpg)
Layout
Engine
100K+ lines of
code
webpage
Parallel Programming w/ Synthesis
Output: locks (Armando L.), SIMD, Green Arrays, SQL, …
Synthesiz
er
layout widgets
attribute grammar Parallel schedule of
tree traversals
10
![Page 11: T PARALLEL BROWSER & PROGRAM SYNTHESISparlab.eecs.berkeley.edu/sites/all/parlab/files/The... · Program Synthesis! 3 . Parallelism for Energy Efficiency Mobile Today 200 sites @ 4.5](https://reader034.vdocuments.us/reader034/viewer/2022050500/5f92cfcaa1f94e71fb5c6fc6/html5/thumbnails/11.jpg)
Layout
Engine
100K+ lines of
code
webpage
Parallel Programming w/ Synthesis
Synthesiz
er
layout widgets
attribute grammar Parallel schedule of
tree traversals
class Paragraph:
word1.w + word2.w = self.w
…
//Constraints: bidirectional, OO, …
11
![Page 12: T PARALLEL BROWSER & PROGRAM SYNTHESISparlab.eecs.berkeley.edu/sites/all/parlab/files/The... · Program Synthesis! 3 . Parallelism for Energy Efficiency Mobile Today 200 sites @ 4.5](https://reader034.vdocuments.us/reader034/viewer/2022050500/5f92cfcaa1f94e71fb5c6fc6/html5/thumbnails/12.jpg)
sched= {w,h}; {x,y}; {…}; …
Leaf
Schedule Layout as Parallel Tree Traversals!
w,h w,h
w,h w,h
w,h
w,h x,y …
sched valid for all webpages (in subset)
[WWW 2010, PPOPP 2013]
w0=sum(w1,w2) h0=max(h1,h2)
document tree
constraints on node attributes logical joins
logical spawns
12
Synthesizer automatically schedules
![Page 13: T PARALLEL BROWSER & PROGRAM SYNTHESISparlab.eecs.berkeley.edu/sites/all/parlab/files/The... · Program Synthesis! 3 . Parallelism for Energy Efficiency Mobile Today 200 sites @ 4.5](https://reader034.vdocuments.us/reader034/viewer/2022050500/5f92cfcaa1f94e71fb5c6fc6/html5/thumbnails/13.jpg)
How to Control Parallel Traversals
_ ;_ ;_ ;_;_ ;_;nest({Text,Font,Inline}, _);_;_
OK: rescheduling attribs
w, h
bug: less parallelism!
sequential_inorder{y,r}
Structured programming: Helped sharing code, testing ideas, and debugging
Hole for code to generate via synthesis: , {x,y}, “||”, …
Synthesizer rejects programs that cannot obey sketch
13
CSS 1.0, 2.0, 2.1, 3.0, 4.0, …
• Edits should not break schedule
• But do want to manually
parallelize
![Page 14: T PARALLEL BROWSER & PROGRAM SYNTHESISparlab.eecs.berkeley.edu/sites/all/parlab/files/The... · Program Synthesis! 3 . Parallelism for Energy Efficiency Mobile Today 200 sites @ 4.5](https://reader034.vdocuments.us/reader034/viewer/2022050500/5f92cfcaa1f94e71fb5c6fc6/html5/thumbnails/14.jpg)
Lessons
Parallel Browser
Requires algorithms,
automation
Surprise wins:
mobile, data viz, layout tools
Program Synthesis
Future of patterns,
autotuning
Helps both novices &
experts
14