Defense talk: Energy-Efficient Mobile Web Computing

1.

1 Energy-Efﬁcient Mobile Web Computing Sept. 7th, 2016 Yuhao Zhu
Electrical and Computer Engineering Department The University of Texas at Austin Advisor: Vijay Janapa Reddi

2.

2 1990 HTML The Web Evolution

3.

2 1990 HTML The Web Evolution

4.

2 1990 HTML 1996 JavaScript The Web Evolution

5.

2 1990 HTML 1996 JavaScript 2008 Mobile Web The Web
Evolution

6.

2 1990 HTML 1996 JavaScript 2008 Mobile Web 2012 Responsive
Web The Web Evolution

7.

Web The Web Evolution Functionality

8.

Web The Web Evolution Functionality Performance

9.

Web 2016 Watt Wise Web The Web Evolution Functionality Performance Energy

10.

Web 2016 Watt Wise Web The Web Evolution Functionality Performance Energy

11.

3 Web: Mobile Overtaking Desktop

12.

0 30 60 90 120 2011 2012 2013 2014 2015
2016 3 Source: BIA/Kelsey Search Volume (B) Web: Mobile Overtaking Desktop

13.

0 30 60 90 120 2011 2012 2013 2014 2015
2016 3 Source: BIA/Kelsey Search Volume (B) Mobile Desktop Web: Mobile Overtaking Desktop

14.

0 30 60 90 120 2011 2012 2013 2014 2015
2016 3 Source: BIA/Kelsey Search Volume (B) Mobile Desktop Web: Mobile Overtaking Desktop When the work started

15.

0 30 60 90 120 2011 2012 2013 2014 2015
2016 3 Source: BIA/Kelsey Search Volume (B) Mobile Desktop Web: Mobile Overtaking Desktop When the work started

16.

4 Web ≈ Mobile Web

17.

5 The Scope of Mobile Web Mobile Client

18.

5 The Scope of Mobile Web Mobile Client Cloud Web
Servers

19.

Servers Cellular Network

20.

Servers Cellular Network

21.

Servers Cellular Network [MICRO 2015] (Top Picks Honorable Mention)

22.

6 The Scope of Mobile Web Mobile Client Cellular Network

23.

6 The Scope of Mobile Web Mobile Client Cellular Network

24.

7 Isn’t Mobile Web a Network Issue? Mobile Client Cellular
Network

25.

38 32 26 20 14 8 2 Load time (s)
10 2 3 4 5 6 7 8 100 2 3 4 5 6 7 8 1000 2 Network RTT (ms) 8 Isn’t Mobile Web a Network Issue?

26.

38 32 26 20 14 8 2 Load time (s)
10 2 3 4 5 6 7 8 100 2 3 4 5 6 7 8 1000 2 Network RTT (ms) 8 Isn’t Mobile Web a Network Issue? ▸ Samsung Galaxy S4 smartphone. ▸ Hot webpages from Alexa1. ▸ Time measured using Navigation Timing API2. 1. http://www.alexa.com/ 2. https://www.w3.org/TR/navigation-timing-2/

27.

38 32 26 20 14 8 2 Load time (s)
10 2 3 4 5 6 7 8 100 2 3 4 5 6 7 8 1000 2 Network RTT (ms) 8 LTE 3G Adverse 3G 2G Wi-Fi Isn’t Mobile Web a Network Issue? ▸ Samsung Galaxy S4 smartphone. ▸ Hot webpages from Alexa1. ▸ Time measured using Navigation Timing API2. 1. http://www.alexa.com/ 2. https://www.w3.org/TR/navigation-timing-2/

28.

38 32 26 20 14 8 2 Load time (s)

29.

38 32 26 20 14 8 2 Load time (s)

30.

9 Mobile Web is also a Compute Issue! Mobile Client
Cellular Network

31.

9 Mobile Web is also a Compute Issue! Mobile Client
Cellular Network My Work

32.

10 Traditional Approach

33.

10 Traditional Approach Frameworks and Libraries HTML JavaScript CSS Language
Runtime Styling Security Local Storage User Input Layout Render

34.

10 Traditional Approach Frameworks and Libraries HTML JavaScript CSS Language
Runtime Styling Security Local Storage User Input Layout Render Application

35.

▸ Parallelize browser computation 10 Traditional Approach Frameworks and Libraries
HTML JavaScript CSS Language Runtime Styling Security Local Storage User Input Layout Render Application

36.

HTML JavaScript CSS Language Runtime Styling Security Local Storage User Input Layout Render Application Architecture

37.

HTML JavaScript CSS Language Runtime Styling Security Local Storage User Input Layout Render Application Architecture ▸ Voltage/frequency scaling on general-purpose processors

38.

HTML JavaScript CSS Language Runtime Styling Security Local Storage User Input Layout Render Application Inputs Architecture ▸ Voltage/frequency scaling on general-purpose processors

39.

▸ Parallelize browser computation ▸ Ignored! 10 Traditional Approach Frameworks
and Libraries HTML JavaScript CSS Language Runtime Styling Security Local Storage User Input Layout Render Application Inputs Architecture ▸ Voltage/frequency scaling on general-purpose processors

40.

▸ Parallelize browser computation ▸ Ignored! 10 Traditional Approach Frameworks
and Libraries HTML JavaScript CSS Language Runtime Styling Security Local Storage User Input Layout Render Application Inputs Architecture ▸ Voltage/frequency scaling on general-purpose processors ▸ End of Dennard Scaling! ▸ Diminishing return

41.

▸ Parallelize browser computation ▸ Ignored! 11 My Approach Frameworks
and Libraries HTML JavaScript CSS Language Runtime Styling Security Local Storage User Input Layout Render Application Inputs Architecture WebCore Web-speciﬁc Architecture

42.

▸ Parallelize browser computation 11 My Approach Frameworks and Libraries
HTML JavaScript CSS Language Runtime Styling Security Local Storage User Input Layout Render Application Inputs Architecture ▸ Lost page-level diversity ▸ Lost user QoS requirements WebCore Web-speciﬁc Architecture

43.

▸ Parallelize browser computation 11 My Approach Frameworks and Libraries
HTML JavaScript CSS Language Runtime Styling Security Local Storage User Input Layout Render Application Architecture ▸ Lost page-level diversity ▸ Lost user QoS requirements WebCore Web-speciﬁc Architecture

44.

12 My Approach Frameworks and Libraries HTML JavaScript CSS Language
Runtime Styling Security Local Storage User Input Layout Render Application Architecture WebCore Web-speciﬁc Architecture GreenWeb Language Extensions

45.

Runtime Styling Security Local Storage User Input Layout Render Application Architecture WebCore Web-speciﬁc Architecture GreenWeb Language Extensions Runtime

46.


47.


48.

WebRT Energy-aware Web Runtime 12 My Approach Frameworks and Libraries
HTML JavaScript CSS Language Runtime Styling Security Local Storage User Input Layout Render Application Architecture WebCore Web-speciﬁc Architecture GreenWeb Language Extensions Runtime

49.

Runtime 13 My Approach Architecture Application WebRT Energy-aware Web Runtime
WebCore Web-speciﬁc Architecture GreenWeb Language Extensions

50.

Runtime 13 My Approach Architecture Application My Dissertation Work WebRT
Energy-aware Web Runtime WebCore Web-speciﬁc Architecture GreenWeb Language Extensions [PLDI 2016] [ISCA 2014] [HPCA 2013] [HPCA 2015] [CAL 2014] (Best of CAL)

51.

Thesis Statement 14

52.

Thesis Statement 14 Future mobile Web systems can achieve energy-efﬁciency
without sacriﬁcing responsiveness by incorporating:

53.

Thesis Statement 14 ▸ Programming language annotations to convey user
QoS information ▸ Runtime scheduling mechanisms to exploit heterogeneous hardware ▸ Hardware accelerators specialized for the key computation kernel Future mobile Web systems can achieve energy-efﬁciency without sacriﬁcing responsiveness by incorporating:

54.

Energy-aware Web Runtime WebCore Web-speciﬁc Architecture GreenWeb Language Extensions

55.

Energy-aware Web Runtime WebCore Web-speciﬁc Architecture GreenWeb Language Extensions

56.

Energy Concern Among Mobile Developers 16 [ICSE 2016] Manotas et
al., “An Empirical Study of Practitioners’ Perspectives on Green Software Engineering”

57.

Energy Concern Among Mobile Developers 16 Percentage (%) 0 25
50 75 100 Mobile Desktop Data Center Never/Rarely Sometimes Often/Almost Always “My applications have requirements about energy usage.” [ICSE 2016] Manotas et al., “An Empirical Study of Practitioners’ Perspectives on Green Software Engineering”

58.


59.


60.

Developers are Willing to Make Trade-offs 17 [ICSE 2016] Manotas
et al., “An Empirical Study of Practitioners’ Perspectives on Green Software Engineering”

61.

Developers are Willing to Make Trade-offs 17 Percentage (%) 0
25 50 75 100 Mobile Never/Rarely Sometimes Often/Almost Always “I'm willing to sacrifice performance, etc. for reduced energy usage.” [ICSE 2016] Manotas et al., “An Empirical Study of Practitioners’ Perspectives on Green Software Engineering”

62.

Developers are Willing to Make Trade-offs 17 Percentage (%) 0
25 50 75 100 Mobile Never/Rarely Sometimes Often/Almost Always “I'm willing to sacrifice performance, etc. for reduced energy usage.” [ICSE 2016] Manotas et al., “An Empirical Study of Practitioners’ Perspectives on Green Software Engineering”

63.

Energy-eﬃciency 18

64.

Quality-of-service Energy-eﬃciency 18

65.

Quality-of-service Energy-eﬃciency Conﬂicting requirements 18

66.

Quality-of-service Energy-efficiency Conflicting requirements 19 GreenWeb Programming language support for
balancing energy-efficiency and QoS in mobile Web computing

67.

20 GreenWeb Programming language support for balancing energy-efﬁciency and QoS
in mobile Web computing

68.

GreenWeb 20 GreenWeb Programming language support for balancing energy-efﬁciency and
QoS in mobile Web computing

69.

21 GreenWeb: Language for Energy-Efﬁciency ▸ Language abstractions for expressing
QoS

70.

21 ▸ Runtime that saves energy while meeting the QoS
constraints GreenWeb: Language for Energy-Efﬁciency ▸ Language abstractions for expressing QoS

71.

21 ▸ Runtime that saves energy while meeting the QoS
constraints ▸ Result in 60% energy savings on real hardware/software implementations GreenWeb: Language for Energy-Efﬁciency ▸ Language abstractions for expressing QoS

72.

21 ▸ Runtime the QoS constraints ▸ Result hardware/software implementations
GreenWeb: Language for Energy-Efﬁciency ▸ Language abstractions for expressing QoS

73.

22 What is QoS in mobile Web?

74.

23 Understanding Mobile Web QoS

75.

23 Performance QoS Experience Understanding Mobile Web QoS

76.

23 Performance QoS Experience [OSDI 1996] Y. Endo et al.,
“Using Latency to Evaluate Interactive System Performance.” Understanding Mobile Web QoS

77.

23 Performance QoS Experience [OSDI 1996] Y. Endo et al.,
“Using Latency to Evaluate Interactive System Performance.” Understanding Mobile Web QoS Too slow

78.

23 Performance QoS Experience Unusable [OSDI 1996] Y. Endo et
al., “Using Latency to Evaluate Interactive System Performance.” Understanding Mobile Web QoS Too slow

79.

23 Performance QoS Experience Unusable Tolerable [OSDI 1996] Y. Endo
et al., “Using Latency to Evaluate Interactive System Performance.” Understanding Mobile Web QoS Too slow

80.

23 Performance QoS Experience Unusable Tolerable [OSDI 1996] Y. Endo
et al., “Using Latency to Evaluate Interactive System Performance.” Understanding Mobile Web QoS Too slow Diminishing Returns

81.

23 Performance QoS Experience Unusable Tolerable Imperceptible [OSDI 1996] Y.
Endo et al., “Using Latency to Evaluate Interactive System Performance.” Understanding Mobile Web QoS Too slow Diminishing Returns

82.

24 Performance QoS Experience Unusable Tolerable Imperceptible Understanding Mobile Web
QoS Energy [OSDI 1996] Y. Endo et al., “Using Latency to Evaluate Interactive System Performance.”

83.


84.


85.


86.

QoS “Negative” Energy consumption Energy [OSDI 1996] Y. Endo et al., “Using Latency to Evaluate Interactive System Performance.”

87.


88.


89.

25 Performance QoS Experience Unusable Tolerable Imperceptible Abstracting Mobile Web
QoS

90.

QoS ▸ Performance metric ▹ Frame latency vs. Frame throughput

91.

QoS ▸ Performance metric ▹ Frame latency vs. Frame throughput QoS Type

92.

QoS ▸ Performance metric ▹ Frame latency vs. Frame throughput ▸ Threshold performance values ▹ Imperceptible target vs. Usable target QoS Type

93.

QoS ▸ Performance metric ▹ Frame latency vs. Frame throughput ▸ Threshold performance values ▹ Imperceptible target vs. Usable target QoS Type QoS Target

94.

26 Expressing Mobile Web QoS

95.

<html> <head> <script> function animateMove() { /* Animation code omitted
*/ } </script> </head> <body> <div ontouchend=“animateMove()”> <div/> <!— other elements --> </body> </html> 26 Expressing Mobile Web QoS

96.

*/ } </script> </head> <body> <div ontouchend=“animateMove()”> <div/> <!— other elements --> </body> </html> 26 Expressing Mobile Web QoS element

97.

*/ } </script> </head> <body> <div ontouchend=“animateMove()”> <div/> <!— other elements --> </body> </html> 26 Expressing Mobile Web QoS element event

98.

*/ } </script> </head> <body> <div ontouchend=“animateMove()”> <div/> <!— other elements --> </body> </html> 26 Expressing Mobile Web QoS element event

99.

*/ } </script> </head> <body> <div ontouchend=“animateMove()”> <div/> <!— other elements --> </body> </html> 26 Expressing Mobile Web QoS Expressing QoS at an event granularity element event

100.

<script> function animateMove() { /* Animation code omitted */ }
</script> </head> <body> <div ontouchend=“animateMove()”> <div/> <!— other elements --> </body> </html> <style> </style> <html> <head> 27 Expressing Mobile Web QoS Annotation element event

101.

<script> function animateMove() { /* Animation code omitted */ }
</script> </head> <body> <div ontouchend=“animateMove()”> <div/> <!— other elements --> </body> </html> <style> </style> <html> <head> 27 Expressing Mobile Web QoS Annotation element event div { } ontouchend

102.

{ : Type, Target} <script> function animateMove() { /* Animation
code omitted */ } </script> </head> <body> <div ontouchend=“animateMove()”> <div/> <!— other elements --> </body> </html> <style> </style> <html> <head> 27 Expressing Mobile Web QoS Annotation element event div { } ontouchend: throughput, low;

103.


104.


105.

code omitted */ } </script> </head> <body> <div ontouchend=“animateMove()”> <div/> <!— other elements --> </body> </html> <style> </style> <html> <head> 27 Expressing Mobile Web QoS Annotation function newAnimateMove() { /* New animation code */ } element event div { } ontouchend: throughput, low;

106.

code omitted */ } </script> </head> <body> <div ontouchend=“animateMove()”> <div/> <!— other elements --> </body> </html> <style> </style> <html> <head> 27 Expressing Mobile Web QoS Annotation function newAnimateMove() { /* New animation code */ } Implementation independent element event div { } ontouchend: throughput, low;

107.

code omitted */ } </script> </head> <body> <div ontouchend=“animateMove()”> <div/> <!— other elements --> </body> </html> <style> </style> <html> <head> 27 Expressing Mobile Web QoS Annotation function newAnimateMove() { /* New animation code */ } Implementation independent element event div { } ontouchend: throughput, low;

108.

code omitted */ } </script> </head> <body> <div ontouchend=“animateMove()”> <div/> <!— other elements --> </body> </html> <style> </style> <html> <head> 27 Expressing Mobile Web QoS Annotation function newAnimateMove() { /* New animation code */ } Implementation independent Non-interfering w.r.t. functionality element event div { } ontouchend: throughput, low;

109.

28 Original application GreenWeb- annotated application GreenWeb Annotation Process Manual
Annotation

110.

28 Original application GreenWeb- annotated application GreenWeb Annotation Process Automatic
Annotation?

111.

28 Original application GreenWeb- annotated application GreenWeb Annotation Process Automatic
Annotation? ▸ AutoGreen: automatically reasons about and inserts GreenWeb annotations

112.

28 GreenWeb- annotated application GreenWeb Annotation Process Automatic Annotation? ▸
AutoGreen: automatically reasons about and inserts GreenWeb annotations DOM Tree

113.

▸ AutoGreen: automatically reasons about and inserts GreenWeb annotations 29
GreenWeb- annotated application GreenWeb Annotation Process

114.

GreenWeb- annotated application GreenWeb Annotation Process Callback Instrumentation

115.

GreenWeb- annotated application GreenWeb Annotation Process QoS Information Event Proﬁling Callback Instrumentation

116.

GreenWeb- annotated application GreenWeb Annotation Process QoS Information Event Proﬁling Annotation Generation Callback Instrumentation

117.

▸ Language abstractions for expressing QoS 30 ▸ Runtime the
QoS constraints ▸ Result hardware/software implementations GreenWeb: Language for Energy-Efﬁciency

118.

▸ Language abstractions 30 ▸ Runtime that saves energy while
meeting the QoS constraints ▸ Result hardware/software implementations GreenWeb: Language for Energy-Efﬁciency

119.

31 GreenWeb Runtime Overview

120.

31 GreenWeb Runtime Overview Frame Event

121.

31 GreenWeb Runtime Overview Frame Event QoS Annotations

122.

31 GreenWeb Runtime Overview Frame Event Enforcing event-level QoS at
the frame-level energy-efﬁciently Runtime Objective QoS Annotations

123.

QoS type: latency QoS target: 16 ms 31 GreenWeb Runtime
Overview Frame Event Enforcing event-level QoS at the frame-level energy-efﬁciently Runtime Objective

124.


125.


126.

Overview Frame Event 16 ms Enforcing event-level QoS at the frame-level energy-efﬁciently Runtime Objective

127.

QoS type: latency QoS target: 16 ms throughput 31 GreenWeb
Runtime Overview Frame Event 16 ms Enforcing event-level QoS at the frame-level energy-efﬁciently Runtime Objective

128.

QoS type: latency QoS target: 16 ms throughput 31 GreenWeb
Runtime Overview Frame Event Frame Frame 16 ms 16 ms 16 ms Enforcing event-level QoS at the frame-level energy-efﬁciently Runtime Objective

129.

31 GreenWeb Runtime Overview Frame Event Frame Frame Time Event
16 ms 16 ms 16 ms Enforcing event-level QoS at the frame-level energy-efﬁciently Runtime Objective QoS target: 2 s

130.

Frame 16 ms 16 ms 16 ms Enforcing event-level QoS at the frame-level energy-efﬁciently Runtime Objective 2 s QoS target: 2 s

131.

Frame 16 ms 16 ms 16 ms Enforcing event-level QoS at the frame-level energy-efﬁciently { Runtime Objective 2 s QoS target: 2 s

132.

Frame 16 ms 16 ms 16 ms Enforcing event-level QoS at the frame-level energy-efﬁciently Frame Association { Runtime Objective 1 2 s

133.

Frame 16 ms 16 ms 16 ms Enforcing event-level QoS at the frame-level energy-efﬁciently Frame Association Frame Scheduling { Runtime Objective 1 2 2 s

134.

32 Frame Association Scripting Style Layout Paint Composite Frame Event

135.

33 Frame Association S S L P C Frame Event

136.

33 Frame Association S S L P C Frame Browser
Process Renderer Process GPU Process Event

137.

Process Renderer Process GPU Process Event Main Thread Compositor Thread

138.

Process Renderer Process GPU Process Event Main Thread Compositor Thread IPC Inter-thread Message

139.

Process Renderer Process GPU Process Event Frame S S L P C

140.

Process Renderer Process GPU Process Event Frame S S L P C Distribute QoS information along with the communication messages

141.

Choices of Energy-saving Techniques 35 GreenWeb can support a range
of energy saving techniques

142.

of energy saving techniques ▹Dynamic resolution scaling [MobiCom 2015] ▹Power-saving display colors [MobiSys 2012] ▹Selective resource loading [NSDI 2015]

143.

of energy saving techniques ▹Dynamic resolution scaling [MobiCom 2015] ▹Power-saving display colors [MobiSys 2012] ▹Selective resource loading [NSDI 2015] ▹ACMP-based hardware mechanism (WebRT)

144.

Asymmetric Chip-multiprocessor 36

145.

Asymmetric Chip-multiprocessor 36 ▸ Offer a large performance-energy trade-off space

146.

Energy Consumption Performance Big Core Small Core Asymmetric Chip-multiprocessor 36
▸ Offer a large performance-energy trade-off space

147.

▸ Offer a large performance-energy trade-off space Frequency Levels

148.

▸ Offer a large performance-energy trade-off space ▸ Already used in commodity devices (e.g., Samsung Galaxy S6) Frequency Levels

149.

Energy Consumption Performance Big Core Small Core ACMP-based GreenWeb Runtime
37 ▸Provide just enough energy to meet QoS constraints Frequency Levels

150.

37 ▸Provide just enough energy to meet QoS constraints div {ontouchend: latency, 16 ms} Frequency Levels

151.

37 ▸Provide just enough energy to meet QoS constraints 16 ms div {ontouchend: latency, 16 ms}

152.

37 ▸Provide just enough energy to meet QoS constraints

153.

37 ▸Provide just enough energy to meet QoS constraints Predict the performance and energy of each conﬁguration!

154.

Different Strategies for Different Events 38 Loading Touching Moving Events

155.

Once per usage session

156.

Proactive Mechanism WebRT Component

157.

Proactive Mechanism WebRT Component Repetitive in a usage session

158.

Proactive Mechanism WebRT Component Adaptive Mechanism

159.

39 Loading Touching Moving Events Proactive Mechanism WebRT Component Adaptive
Mechanism Different Strategies for Different Events

160.

40 Breaking Down the Computations 40

161.

40 Breaking Down the Computations HTML (Structure) CSS (Style) 40

162.

40 Breaking Down the Computations Tag Attribute HTML (Structure) CSS
(Style) 40

163.

40 Breaking Down the Computations Tag Attribute HTML (Structure) CSS
(Style) Selector Property 40

164.

40 Breaking Down the Computations DOM Tree Tag Attribute HTML
(Structure) CSS (Style) Selector Property 40

165.

40 Breaking Down the Computations DOM Tree Tag Attribute HTML
(Structure) CSS (Style) Selector Property 40 Web Primitives

166.

Predicting Loading Performance & Energy 41 Idea: predict load time
& energy (responses) based on Web primitives (predictors)

167.

Predicting Loading Performance & Energy 41 Identify Predictors Training using
top 2,500 webpages Predictors (HTML, CSS) Responses (Time, Energy)

168.

top 2,500 webpages Model Construction & Refinement Refine the linear model Predictors (HTML, CSS) Responses (Time, Energy) Mitigate Over-fitting Model Non-Linearity Linear Regression

169.

top 2,500 webpages Model Construction & Refinement Refine the linear model Model Validation Validating on another 2,500 webpages Predictors (HTML, CSS) Responses (Time, Energy) Mitigate Over-fitting Model Non-Linearity Linear Regression Loading Time Model Energy Model

170.

42 0.00 0.05 0.10 0.15 0.20 performance • • •
• • • • • • • • • • • • • • • • • • • • • • 0.00 0.05 0.10 0.15 0.20 energy Median prediction error is less than 5% Predicting Loading Performance & Energy

171.

43 Loading Touching Moving Interactions Proactive Mechanism WebRT Component Adaptive

172.

43 Loading Touching Moving Interactions Proactive Mechanism WebRT Component Adaptive

173.

Energy Consumption Performance ACMP-based GreenWeb Runtime 44 Execution Time =
[PLDI 2003] Xie, et al., “Compile-Time Dynamic Voltage Scaling Settings: Opportunities and Limits” Energy =

174.

Tmemory + [PLDI 2003] Xie, et al., “Compile-Time Dynamic Voltage Scaling Settings: Opportunities and Limits” Energy =

175.

Tcpu Energy Consumption Performance ACMP-based GreenWeb Runtime 44 Execution Time
= Tmemory + [PLDI 2003] Xie, et al., “Compile-Time Dynamic Voltage Scaling Settings: Opportunities and Limits” Energy =

176.

Tmemory + Ncycles / f [PLDI 2003] Xie, et al., “Compile-Time Dynamic Voltage Scaling Settings: Opportunities and Limits” Energy =

177.

Tmemory + Ncycles / f [PLDI 2003] Xie, et al., “Compile-Time Dynamic Voltage Scaling Settings: Opportunities and Limits” Energy =

178.

Tmemory + Ncycles / f [PLDI 2003] Xie, et al., “Compile-Time Dynamic Voltage Scaling Settings: Opportunities and Limits” Energy = Execution Time x Power

179.

▸ Language abstractions 45 ▸ Runtime that saves energy while
meeting the QoS constraints ▸ Result hardware/software implementations GreenWeb: Language for Energy-Efﬁciency

180.

▸ Language abstractions 45 ▸ Runtime the QoS constraints ▸
Result in 60% energy savings on real hardware/software implementations GreenWeb: Language for Energy-Efﬁciency

181.

Real Hardware/Software Setup 46 ODroid XU+E development board, which contains
an Exynos 5410 SoC used in Samsung Galaxy S4.

182.

an Exynos 5410 SoC used in Samsung Galaxy S4. Little core cluster: ARM Cortex A7, In-order with 2 issue Big core cluster: ARM Cortex A15, OoO with 3 issue Overhead: ▸ Frequency switch: 100 us ▸ Core migration: 20 us

183.

an Exynos 5410 SoC used in Samsung Galaxy S4. Implementation incorporated into Chrome running on Android. Little core cluster: ARM Cortex A7, In-order with 2 issue Big core cluster: ARM Cortex A15, OoO with 3 issue Overhead: ▸ Frequency switch: 100 us ▸ Core migration: 20 us

184.

an Exynos 5410 SoC used in Samsung Galaxy S4. Implementation incorporated into Chrome running on Android. UI-level record and replay for reproducibility. [ISPASS’15] Little core cluster: ARM Cortex A7, In-order with 2 issue Big core cluster: ARM Cortex A15, OoO with 3 issue Overhead: ▸ Frequency switch: 100 us ▸ Core migration: 20 us

185.

Power and Energy Measurements 48 + - Vin+ Vin- Vout
GND Sense resistor 15mΩ SoC ARM Cortex A9 VRM Gain x50 Probe Data Acquisition (DAQ) Power = (Vin + - Vin -) / Rsense * Vin -

186.

Evaluation ▸Baseline Mechanisms ▹Highest performance (Perf) — Standard to guarantee
responsiveness ▹Interactive governor (Interactive) — Android default 49 49

187.

responsiveness ▹Interactive governor (Interactive) — Android default 49 ▸Metrics ▹Energy Saving ▹QoS Violation 49

188.

responsiveness ▹Interactive governor (Interactive) — Android default 49 ▸Metrics ▹Energy Saving ▹QoS Violation 49 ▸Applications ▹Top webpages (e.g., www.amazon.com) ▹Web Apps based on popular frameworks (e.g., Todo List)

189.

50 Norm. Energy 0.0 0.3 0.5 0.8 1.0 CamanJS Craigslist
Paperjs Goo Google Todo CNet BBC LZMA-JS Amazon W3School MSN GreenWeb Interactive Perf Evaluation Results

190.


191.


192.

53 Evaluation Results QoS Violations (%) 0.0 0.8 1.5 2.3
3.0 CamanJS Craigslist Paperjs Goo Google Todo CNet BBC LZMA-JS Amazon W3School MSN Norm. Energy 0.0 0.3 0.5 0.8 1.0 CamanJS Craigslist Paperjs Goo Google Todo CNet BBC LZMA-JS Amazon W3School MSN GreenWeb Interactive Perf

193.

Norm. Energy 0.0 0.3 0.5 0.8 1.0 CamanJS Craigslist Paperjs
Goo Google Todo CNet BBC LZMA-JS Amazon W3School MSN GreenWeb Interactive Perf 54 Evaluation Results QoS Violations (%) 0.0 0.8 1.5 2.3 3.0 CamanJS Craigslist Paperjs Goo Google Todo CNet BBC LZMA-JS Amazon W3School MSN No QoS Violations

194.

Norm. Energy 0.0 0.3 0.5 0.8 1.0 CamanJS Craigslist Paperjs
Goo Google Todo CNet BBC LZMA-JS Amazon W3School MSN GreenWeb Interactive Perf 54 Evaluation Results QoS Violations (%) 0.0 0.8 1.5 2.3 3.0 CamanJS Craigslist Paperjs Goo Google Todo CNet BBC LZMA-JS Amazon W3School MSN 29.2% - 66.0% energy savings, 0.8% more QoS violations No QoS Violations

195.

Architecture Conﬁguration Distribution 55 100 80 60 40 20 0
Time Distribution (%) CamanJS Craigslist Paperjs Goo Google Todo Cnet BBC LZMA-JS Amazon W3School MSN A15 A7 GHz 1.6 1.4 1.2 1.0 0.8 0.6 0.4

196.

Architecture Conﬁguration Distribution 55 100 80 60 40 20 0
Time Distribution (%) CamanJS Craigslist Paperjs Goo Google Todo Cnet BBC LZMA-JS Amazon W3School MSN A15 A7 GHz 1.6 1.4 1.2 1.0 0.8 0.6 0.4

197.

in mobile Web computing

198.

in mobile Web computing Abstraction Express QoS constraints

199.

in mobile Web computing Abstraction Express QoS constraints Runtime Satisfy QoS speciﬁcations using energy saving techniques

200.

in mobile Web computing Abstraction Express QoS constraints Runtime Satisfy QoS speciﬁcations using energy saving techniques Effect Signiﬁcant energy savings

201.

Runtime 57 My Approach Architecture Application WebRT Energy-aware Web Runtime
WebCore Web-speciﬁc Architecture GreenWeb Language Extensions My Dissertation Work

202.

58 Execution Time Energy General-Purpose Designs WebCore: a Web-Speciﬁc Mobile
Architecture

203.

58 Execution Time Energy General-Purpose Designs WebCore: a Web-Speciﬁc Mobile
Architecture Diminishing return

204.

58 Execution Time Energy ASIC? General-Purpose Designs WebCore: a Web-Speciﬁc
Mobile Architecture

205.

58 Execution Time Energy ASIC? Extremely challenging ‣Chrome: 17M LoC,
29 languages ▹ c.f., H264 codec: 0.13M LoC, 6 languages ‣Code base is very irregular ▹ Not amenable to traditional specialization General-Purpose Designs WebCore: a Web-Speciﬁc Mobile Architecture

206.

58 Execution Time Energy ASIC? General-Purpose Designs WebCore: a Web-Speciﬁc
Mobile Architecture Goal

207.

58 Execution Time Energy ??? ASIC? General-Purpose Designs WebCore: a
Web-Speciﬁc Mobile Architecture Goal

208.

WebCore: a Web-Speciﬁc Mobile Architecture 59 Execution Time Energy General-Purpose
Designs Goal

209.

Designs Customization Goal

210.

Designs Customization Specialization Goal

211.

Specialization Target: Style Resolution Kernel 60

212.

Specialization Target: Style Resolution Kernel 60 10% 13% 17% 25%
35% Render Style Other Layout DOM 12% 14% 16% 18% 40% Render Style Other Layout DOM Execution time breakdown Energy breakdown

213.

Specialization Target: Style Resolution Kernel 60 10% 13% 17% 25%
35% Render Style Other Layout DOM 12% 14% 16% 18% 40% Render Style Other Layout DOM Execution time breakdown Energy breakdown

214.

Specialization Target: Style Resolution Kernel 60 for (each rule in
matchedRules) { for (each property in rule) { switch (property.id) { case Font: Style[Font] = Handler(property.value, DOMNode); break; case N: ...}}}

215.

matchedRules) { for (each property in rule) { switch (property.id) { case Font: Style[Font] = Handler(property.value, DOMNode); break; case N: ...}}}

216.

matchedRules) { for (each property in rule) { switch (property.id) { case Font: Style[Font] = Handler(property.value, DOMNode); break; case N: ...}}} Rule-level Parallelism (RLP)

217.

matchedRules) { for (each property in rule) { switch (property.id) { case Font: Style[Font] = Handler(property.value, DOMNode); break; case N: ...}}} Rule-level Parallelism (RLP)

218.

matchedRules) { for (each property in rule) { switch (property.id) { case Font: Style[Font] = Handler(property.value, DOMNode); break; case N: ...}}} Rule-level Parallelism (RLP) Property-level Parallelism (PLP)

219.

matchedRules) { for (each property in rule) { switch (property.id) { case Font: Style[Font] = Handler(property.value, DOMNode); break; case N: ...}}} Rule-level Parallelism (RLP) Property-level Parallelism (PLP) ▸ Exploiting the parallelism to increase the arithmetic intensity ▸ Move operands closer to operations to sustain the computations

220.

... ... Rule j ... ... Prop l ... ...
Rule i.id ... Prop m ... Prop k ... Rule j.id ... ... ... ... ... start end start end Rule i Prop k Prop m Prop m Prop l Style l Style m Style k Style Resolution Unit 61 Prop m Prop m 61 Input Scratchpad Conﬂict Resolution Output Scratchpad Compute Lanes

221.

Evaluation Results 62

222.

Evaluation Results 62 ▸Fully synthesized using Synopsys 28 nm toolchain

223.

Evaluation Results 62 ▸Fully synthesized using Synopsys 28 nm toolchain
▸Cost of specialization: 0.59 mm2 area overhead ▹ SoC die area is 122 mm2 in Samsung Galaxy S4 ▹ A15s’ area: 19 mm2

224.

Evaluation Results 62 0.55 0.688 0.825 0.963 1.1 1.6 1.8
2 2.2 2.4 Energy (J) Load Time (s) ▸Fully synthesized using Synopsys 28 nm toolchain ▸Cost of specialization: 0.59 mm2 area overhead ▹ SoC die area is 122 mm2 in Samsung Galaxy S4 ▹ A15s’ area: 19 mm2

225.

2 2.2 2.4 Energy (J) Load Time (s) A15-like design ▸Fully synthesized using Synopsys 28 nm toolchain ▸Cost of specialization: 0.59 mm2 area overhead ▹ SoC die area is 122 mm2 in Samsung Galaxy S4 ▹ A15s’ area: 19 mm2

226.

2 2.2 2.4 Energy (J) Load Time (s) A15-like design Customization ▸Fully synthesized using Synopsys 28 nm toolchain ▸Cost of specialization: 0.59 mm2 area overhead ▹ SoC die area is 122 mm2 in Samsung Galaxy S4 ▹ A15s’ area: 19 mm2

227.

2 2.2 2.4 Energy (J) Load Time (s) 18.6% A15-like design Customization ▸Fully synthesized using Synopsys 28 nm toolchain ▸Cost of specialization: 0.59 mm2 area overhead ▹ SoC die area is 122 mm2 in Samsung Galaxy S4 ▹ A15s’ area: 19 mm2

228.

2 2.2 2.4 Energy (J) Load Time (s) 18.6% 22.2% A15-like design Customization ▸Fully synthesized using Synopsys 28 nm toolchain ▸Cost of specialization: 0.59 mm2 area overhead ▹ SoC die area is 122 mm2 in Samsung Galaxy S4 ▹ A15s’ area: 19 mm2

229.

2 2.2 2.4 Energy (J) Load Time (s) 18.6% 22.2% A15-like design Customization Specialization ▸Fully synthesized using Synopsys 28 nm toolchain ▸Cost of specialization: 0.59 mm2 area overhead ▹ SoC die area is 122 mm2 in Samsung Galaxy S4 ▹ A15s’ area: 19 mm2

230.

2 2.2 2.4 Energy (J) Load Time (s) 18.6% 22.2% 22.2% A15-like design Customization Specialization ▸Fully synthesized using Synopsys 28 nm toolchain ▸Cost of specialization: 0.59 mm2 area overhead ▹ SoC die area is 122 mm2 in Samsung Galaxy S4 ▹ A15s’ area: 19 mm2

231.

2 2.2 2.4 Energy (J) Load Time (s) 18.6% 22.2% 9.2% 22.2% A15-like design Customization Specialization ▸Fully synthesized using Synopsys 28 nm toolchain ▸Cost of specialization: 0.59 mm2 area overhead ▹ SoC die area is 122 mm2 in Samsung Galaxy S4 ▹ A15s’ area: 19 mm2

232.

2 2.2 2.4 Energy (J) Load Time (s) A15-like design Customization Specialization 29.2% 47.0% ▸Fully synthesized using Synopsys 28 nm toolchain ▸Cost of specialization: 0.59 mm2 area overhead ▹ SoC die area is 122 mm2 in Samsung Galaxy S4 ▹ A15s’ area: 19 mm2

233.

Retrospective: Three Principles Learnt 63 Runtime Application Architecture

234.

Retrospective: Three Principles Learnt 63 Runtime Application Architecture ▸ General-purpose
vs. Specialization

235.

Retrospective: Three Principles Learnt 63 Runtime Application Architecture ▸ Exploiting
Application Diversity ▸ General-purpose vs. Specialization

236.

Retrospective: Three Principles Learnt 63 Runtime Application Architecture ▸ Empowering
Web Developers ▸ Exploiting Application Diversity ▸ General-purpose vs. Specialization

237.

Web 2016 Watt Wise Web The Web Evolution

238.

Web 2016 Watt Wise Web The Web Evolution ???

239.

65

240.

65

241.

65 Franeworks and Libraries HTML JavaScript CSS Language Runtime Styling
Security Local Storage User Input Layout Render Franeworks and Libraries HTML JavaScript CSS Language Runtime Styling Security Local Storage User Input Layout Render Franeworks and Libraries HTML JavaScript CSS Language Runtime Styling Security Local Storage User Input Layout Render Franeworks and Libraries HTML JavaScript CSS Language Runtime Styling Security Local Storage User Input Layout Render Franeworks and Libraries HTML JavaScript CSS Language Runtime Styling Security Local Storage User Input Layout Render

242.

66 wattwiseweb.org

243.

Thank you!

244.

[ACM Queue] Yuhao Zhu, Vijay Janapa Reddi, “The Red future
of Mobile Web Computing” [PLDI 2016] Yuhao Zhu, Vijay Janapa Reddi, “GreenWeb: Language Extensions for Energy-Efficient Mobile Web Computing” [HPCA 2015] Yuhao Zhu, Matthew Halpern, Vijay Janapa Reddi, “Event- Based Scheduling for Energy-Efficient QoS (eQoS) in Mobile Web Applications” [HPCA 2013] Yuhao Zhu, Vijay Janapa Reddi, “High-Performance and Energy-Efficient Mobile Web Browsing on Big/Little Systems” [CAL 2012] Yuhao Zhu, Aditya Srikanth, Jingwen Leng, Vijay Janapa Reddi, “Exploiting Webpage Characteristics for Energy-Efficient Mobile Web Browsing” (Best of CAL) [ISCA 2014] Yuhao Zhu, Vijay Janapa Reddi, “WebCore: Architectural Support for Mobile Web Browsing” [IEEE MICRO 2015] Yuhao Zhu, Matthew Halpern, Vijay Janapa Reddi, “The Role of the CPU in Energy-Efficient Mobile Web Browsing” [HPCA 2016] Matthew Halpern, Yuhao Zhu, Vijay Janapa Reddi, “Mobile CPU’s Rise to Power: Quantifying the Impact of Generational Mobile CPU Design Trends on Performance, Energy, and User Satisfaction” GreenWeb WebRT WebCore Motivational Studies Future Web

245.

[DAC 2011] Yuhao Zhu, Yangdong Deng, Yubei Chen, “Hermes: An
Integrated CPU/GPU Microarchitecture for IP Routing.” [DAC 2010] Bo Wang, Yuhao Zhu, Yangdong Deng, “Distributed Time, Conservative Parallel Logic Simulation on GPUs.” [TODAES 2011] Yuhao Zhu, Bo Wang, Yangdong Deng, “Massively Parallel Logic Simulation with GPUs.” [ISPASS 2015] Matthew Halpern, Yuhao Zhu, Ramesh Peri, and Vijay Janapa Reddi, “Mosaic: Cross-platform User-interaction Record and Replay for the Fragmented Android Ecosystem.” [IRPS 2014] Chen Zhou, Xiaofei Wang, Weichao Xu, Yuhao Zhu, Vijay Janapa Reddi, Chris Kim, “Estimation of Instantaneous Frequency Fluctuation in a Fast DVFS Environment Using an Empirical BTI Stress- Relaxation Model.” GPGPU & IP Routing Architecture Tools Reliability [MICRO 2015] Yuhao Zhu, Daniel Richins, Matthew Halpern, Vijay Janapa Reddi, “Microarchitectural Implications of Event-driven Server- side Web Applications” (Top Picks Honorable Mention) Server Microarch

246.

Coursework 70 Name Instructor Semester SUP Grade COMPILERS Keshav Pingali
Fall 2010 A ADV EMBED MICROCONTROL SYS Mark McDermott Spring 2011 A- MEMORY MANAGEMENT Kathryn McKinley Spring 2011 Y A VLSI I Jacob Abraham Fall 2011 A- COMP ARCH: PARALLISM/LOCLTY Mattan Erez Fall 2011 A MICROARCHITECTURE Yale Patt Spring 2012 B DYNAMIC COMPILATION Vijay Janapa Reddi Spring 2012 A- COMP PERF EVAL/BENCHMARKING Lizy John Fall 2012 B+ PARALLEL COMP ARCHITECTURE Derek Chiou Spring 2013 B+ HUMAN COMPUT & CROWDSRCING Matt Lease Fall 2015 Y A-

Defense talk: Energy-Efficient Mobile Web Computing

Defense talk: Energy-Efficient Mobile Web Computing

Want more?

Transcript