Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Speaker Deck
PRO
Sign in
Sign up
for free
Dive into 0.016 seconds of WebGL
yomotsu
September 16, 2014
Programming
0
730
Dive into 0.016 seconds of WebGL
yomotsu
September 16, 2014
Tweet
Share
More Decks by yomotsu
See All by yomotsu
yomotsu
0
320
yomotsu
0
350
yomotsu
2
940
yomotsu
5
7.4k
yomotsu
4
6.7k
yomotsu
1
830
yomotsu
4
3.7k
yomotsu
2
830
yomotsu
3
1.1k
Other Decks in Programming
See All in Programming
line_developers_tw
0
460
aratayokoyama
0
200
dulltz
0
500
nbkouhou
0
860
mu2in
0
140
hr01
1
1.2k
hanhan1978
0
290
ufoo68
1
170
akatsukinewgrad
0
170
taoshotaro
1
360
bkuhlmann
4
620
kyoheig3
0
420
Featured
See All Featured
addyosmani
494
110k
reverentgeek
168
7.1k
akmur
252
19k
trishagee
20
2.1k
brad_frost
156
6.4k
paulrobertlloyd
71
3.6k
paulrobertlloyd
71
1.4k
andyhume
62
3.4k
trallard
13
640
ufuk
56
5.4k
scottboms
251
11k
jensimmons
207
10k
Transcript
1 Dive into 0.016 seconds of WebGL Presented by Akihiro
Oyamada (@yomotsu) Frontend Engineer at PixelGrid, Inc. Sep 16, 2014
2 Hello! Frontend Engineer at PixelGrid, Inc. @yomotsu
• Beautiful! • Cool Technology! • very hot!! 3 Impressions
of WebGL
4 100°C! (212°F)
5 WebGL makes your Mac Book Very Hot
6 https://yomotsu.github.io/walkthrough I’m making a game in three.js for fun
It was working with 60 FPS 7
• FPS stands for Frames Per Second • The number
of rendering per one second 8
9 http://yomotsu.github.io/FPS_Comparison/ 20 FPS vs 60 FPS
10
11
Why 60 FPS? 12
• Most computer screens have a refresh rate of 60
Hertz • Most console games work with 60 FPS too 13
Dive into a Frame 14 0 . 0 1 6
s e c o n d s
Realtime 3D works with Forward Rendering 15 or Deferred
rendering
16 16
17
18 Lets take a look ! demo
19
Drawcalls increase CPU load and the temperature 20
Take care of CPU, GPU and RAM! 21 I’ll have
a talk about optimization sometime soon! perhaps at CodeGrid https://app.codegrid.net/
22 gl.finish(); @yomotsu