The document presents an exploratory study on energy patterns for web applications, highlighting the need for developers to be aware of energy-related coding practices. It discusses various energy-saving techniques such as using dark UI colors, dynamic retry delays, and push notifications over polling, and assesses developers' familiarity and concerns regarding these patterns and anti-patterns. The study indicates that a significant percentage of developers lack awareness of energy patterns, which can impact energy efficiency in coding practices.

1. Energy Patterns for Web:
An Exploratory Study
Pooja Rani, Jonas Zellweger, Veronika Kousadianos,
Luis Cruz, Timo Kehrer, Alberto Bacchelli,
University of Zurich, Switzerland

2. 2
Data Source: Climate Action Tracker

3. 3
Data Source: Climate Action Tracker

4. /**
* TODO
*/
public void log(String s) {
System.out.println(s);
}
Is it our problem?

5. 5
ICT: Information and Communication Technology
Around 4.6 billion people use the internet every day.
Is it our problem?

6. 6
ICT: Information and Communication Technology
Around 4.6 billion people use the internet every day.
Is it our problem?

7. 7
ICT: Information and Communication Technology
Around 4.6 billion people use the internet every day.
Is it our problem?

8. 8
ICT: Information and Communication Technology
Around 4.6 billion people use the internet every day.
Is it our problem?

9. 9
Bree et al.,, 2022, The energy cost of the visitor pattern
What can we do?
Being aware of energy-related coding practices
in web world can help us make better choices

10. 10
Bree et al.,, 2022, The energy cost of the visitor pattern
What can we do?
Energy patterns
Being aware of energy-related coding practices
in web world can help us make better choices

11. 11
Gillies et al. 2011
It requires a multi-perspective view

12. 12
RQ1
Are there energy patterns for
Web apps?
It requires a multi-perspective view

13. 13
RQ1
Are there energy patterns for
Web apps?
What is developers’
perception on patterns? RQ2
It requires a multi-perspective view

14. 14
RQ1
Are there energy patterns for
Web apps?
Do energy patterns
really impact?
RQ3
What is developers’
perception on patterns? RQ2
It requires a multi-perspective view

15. 15
RQ1
Are there energy patterns for
Web apps?
It requires a multi-perspective view
Do energy patterns
really impact?
RQ3
What is developers’
perception on patterns? RQ2

16. 16
https://tqrg.github.io/energy-patterns/#/
Dark UI Colors
Provide a dark UI colour theme to save battery.
Dynamic Retry Delay
Whenever an attempt to access a resource has failed, increase the interval of time waited before asking it
Open Only When Necessary
Open/start resources/services only when they are strictly necessary.
Push Over Poll
Use push notifications to receive updates from resources instead of actively querying resources (polling)
Power Awareness
Have a different behavior when device is connected/disconnected to a power station
Wifi Over Cellular
Delay or disable heavy data connections until the device is connected to a WiFi network
22 Mobile
energy patterns
RQ1: Energy Patterns for the Web

17. 17
https://tqrg.github.io/energy-patterns/#/
2
Dark UI Colors
Provide a dark UI colour theme to save battery.
Dynamic Retry Delay
Whenever an attempt to access a resource has failed, increase the interval of time waited before asking it
Open Only When Necessary
Open/start resources/services only when they are strictly necessary.
Push Over Poll
Use push notifications to receive updates from resources instead of actively querying resources (polling)
Power Awareness
Have a different behavior when device is connected/disconnected to a power station
Wifi Over Cellular
Delay or disable heavy data connections until the device is connected to a WiFi network
20 Web
energy patterns
RQ1: Energy Patterns for the Web
20

18. 18
https://tqrg.github.io/energy-patterns/#/
RQ2: Developers’ Perception on Patterns
Dark UI Colors
Provide a dark UI colour theme to save battery.
Dynamic Retry Delay
Whenever an attempt to access a resource has failed, increase the interval of time waited before asking it
Open Only When Necessary
Open/start resources/services only when they are strictly necessary.
Push Over Poll
Use push notifications to receive updates from resources instead of actively querying resources (polling)
Power Awareness
Have a different behavior when device is connected/disconnected to a power station
Wifi Over Cellular
Delay or disable heavy data connections until the device is connected to a WiFi network
20 Web
energy patterns

19. Dark UI Colors
Provide a dark UI colour theme to save battery.
Dynamic Retry Delay
Whenever an attempt to access a resource has failed, increase the interval of time waited before asking it
Open Only When Necessary
Open/start resources/services only when they are strictly necessary.
Push Over Poll
Use push notifications to receive updates from resources instead of actively querying resources (polling)
Power Awareness
Have a different behavior when device is connected/disconnected to a power station
Wifi Over Cellular
Delay or disable heavy data connections until the device is connected to a WiFi network
19
https://tqrg.github.io/energy-patterns/#/
RQ2: Developers’ Perception on Patterns

20. Dark UI Colors
Provide a dark UI colour theme to save battery.
Dynamic Retry Delay
Whenever an attempt to access a resource has failed, increase the interval of time waited before asking it
Open Only When Necessary
Open/start resources/services only when they are strictly necessary.
Push Over Poll
Use push notifications to receive updates from resources instead of actively querying resources (polling)
Power Awareness
Have a different behavior when device is connected/disconnected to a power station
Wifi Over Cellular
Delay or disable heavy data connections until the device is connected to a WiFi network
20
https://tqrg.github.io/energy-patterns/#/
1 sec
2 sec
4 sec
RQ2: Developers’ Perception on Patterns

21. Dark UI Colors
Provide a dark UI colour theme to save battery.
Dynamic Retry Delay
Whenever an attempt to access a resource has failed, increase the interval of time waited before asking it
Open Only When Necessary
Open/start resources/services only when they are strictly necessary.
Push Over Poll
Use push notifications to receive updates from resources instead of actively querying resources (polling)
Power Awareness
Have a different behavior when device is connected/disconnected to a power station
Wifi Over Cellular
Delay or disable heavy data connections until the device is connected to a WiFi network
21
https://tqrg.github.io/energy-patterns/#/
1 sec
2 sec
4 sec
RQ2: Developers’ Perception on Patterns
Pattern

22. Dark UI Colors
Provide a dark UI colour theme to save battery.
Dynamic Retry Delay
Whenever an attempt to access a resource has failed, increase the interval of time waited before asking it
Open Only When Necessary
Open/start resources/services only when they are strictly necessary.
Push Over Poll
Use push notifications to receive updates from resources instead of actively querying resources (polling)
Power Awareness
Have a different behavior when device is connected/disconnected to a power station
Wifi Over Cellular
Delay or disable heavy data connections until the device is connected to a WiFi network
22
https://tqrg.github.io/energy-patterns/#/
1 sec
2 sec
4 sec
RQ2: Developers’ Perception on Patterns
Pattern
3 sec
3 sec
3 sec
(Anti)pattern

23. 23
RQ2: Developers’ Perception on Patterns
familiarity
on patterns

24. 24
RQ2: Developers’ Perception on Patterns
familiarity
on patterns
Concerns on
antipatterns

25. 25
RQ2: Developers’ Perception on Patterns
familiarity
on patterns
Patterns in
source code
Concerns on
antipatterns

26. 26
RQ2: Developers’ Perception on Patterns
familiarity
on patterns
Patterns in
source code
Other
questions
Concerns on
antipatterns
Case study with 6
web developers

27. 27
Familiar with Energy Patterns
17% 17%
66%
Never heard Strong understanding

28. 28
Concerns about Anti-patterns
17% 33% 50%
Open Only When Necessary
17% 17% 66%
Dynamic Retry Delay
Least concerned Extremely concerned

29. 29
Energy Patterns in Source code

30. 30
9 patterns found in code
11 anti patterns in code
4 not applicable to code
Energy Patterns in Source code

31. 31
RQ3: Impact of Energy Patterns
Do they
really impact?
Dark UI Colors
Provide a dark UI colour theme to save battery.
Dynamic Retry Delay
Whenever an attempt to access a resource has failed, increase the interval of time waited before asking it
Open Only When Necessary
Open/start resources/services only when they are strictly necessary.
Push Over Poll
Use push notifications to receive updates from resources instead of actively querying resources (polling)
Power Awareness
Have a different behavior when device is connected/disconnected to a power station
Wifi Over Cellular
Delay or disable heavy data connections until the device is connected to a WiFi network

32. Dark UI Colors
Provide a dark UI colour theme to save battery.
Dynamic Retry Delay
Whenever an attempt to access a resource has failed, increase the interval of time waited before asking it
Open Only When Necessary
Open/start resources/services only when they are strictly necessary.
Push Over Poll
Use push notifications to receive updates from resources instead of actively querying resources (polling)
Power Awareness
Have a different behavior when device is connected/disconnected to a power station
Wifi Over Cellular
Delay or disable heavy data connections until the device is connected to a WiFi network
32
RQ3: Impact of Energy Patterns
1 sec
2 sec
4 sec
Pattern

33. Dark UI Colors
Provide a dark UI colour theme to save battery.
Dynamic Retry Delay
Whenever an attempt to access a resource has failed, increase the interval of time waited before asking it
Open Only When Necessary
Open/start resources/services only when they are strictly necessary.
Push Over Poll
Use push notifications to receive updates from resources instead of actively querying resources (polling)
Power Awareness
Have a different behavior when device is connected/disconnected to a power station
Wifi Over Cellular
Delay or disable heavy data connections until the device is connected to a WiFi network
33
RQ3: Impact of Energy Patterns
3 sec
3 sec
3 sec
(Anti)pattern
1 sec
2 sec
4 sec
Pattern

34. Dark UI Colors
Provide a dark UI colour theme to save battery.
Dynamic Retry Delay
Whenever an attempt to access a resource has failed, increase the interval of time waited before asking it
Open Only When Necessary
Open/start resources/services only when they are strictly necessary.
Push Over Poll
Use push notifications to receive updates from resources instead of actively querying resources (polling)
Power Awareness
Have a different behavior when device is connected/disconnected to a power station
Wifi Over Cellular
Delay or disable heavy data connections until the device is connected to a WiFi network
34
RQ3: Impact of Energy Patterns

35. Dark UI Colors
Provide a dark UI colour theme to save battery.
Dynamic Retry Delay
Whenever an attempt to access a resource has failed, increase the interval of time waited before asking it
Open Only When Necessary
Open/start resources/services only when they are strictly necessary.
Push Over Poll
Use push notifications to receive updates from resources instead of actively querying resources (polling)
Power Awareness
Have a different behavior when device is connected/disconnected to a power station
Wifi Over Cellular
Delay or disable heavy data connections until the device is connected to a WiFi network
35
RQ3: Impact of Energy Patterns
load images as scroll
Pattern

36. Dark UI Colors
Provide a dark UI colour theme to save battery.
Dynamic Retry Delay
Whenever an attempt to access a resource has failed, increase the interval of time waited before asking it
Open Only When Necessary
Open/start resources/services only when they are strictly necessary.
Push Over Poll
Use push notifications to receive updates from resources instead of actively querying resources (polling)
Power Awareness
Have a different behavior when device is connected/disconnected to a power station
Wifi Over Cellular
Delay or disable heavy data connections until the device is connected to a WiFi network
36
RQ3: Impact of Energy Patterns
load images as scroll
Pattern
load all images
(Anti)pattern

37. Dark UI Colors
Provide a dark UI colour theme to save battery.
Dynamic Retry Delay
Whenever an attempt to access a resource has failed, increase the interval of time waited before asking it
Open Only When Necessary
Open/start resources/services only when they are strictly necessary.
Push Over Poll
Use push notifications to receive updates from resources instead of actively querying resources (polling)
Power Awareness
Have a different behavior when device is connected/disconnected to a power station
Wifi Over Cellular
Delay or disable heavy data connections until the device is connected to a WiFi network
37
RQ3: Impact of Energy Patterns

38. 38
https://tqrg.github.io/energy-patterns/#/
Takeaways
83% developers are not familiar with energy patterns.
Developers are concerned about many anti patterns.
They could find 16 (anti) patterns in source code.
Energy impact of energy patterns vary.

39. 39
Paper
Replication Package
My pro
fi
le

40. More Curious?

41. 41
(4) Inquire about
patterns in source code
(6) questions on
demographic info
welcome &
instructions
(1) Insights on energy
pattern awareness
(2) Introduction of
energy (anti) patterns
(5) Resource investment
for energy patterns
(3) Concerns for energy
(anti) patterns
Case study with 3 web developers
from a energy-grid based company
3 developers from
other companies
RQ2: Developers’ Perception on Patterns

42. 42
PowerLog
Measure energy
consumption
User scenarios for
energy(anti) patterns
Start Browser and
Demo websites
Execute scenario
on websites
Compute results
Start Pipeline Quit Browser
50 Iterations
RQ3: Impact of Energy Patterns

43. 43

44. 44
Technologies disappear, software
updates, increasing development costs
due to technical debt, high-performance
systems that need high power.
Saputri and Lee, 2021, Integrated framework for incorporating sustainability design in software engineering life-cycle: An empirical study