~/talk

Cascading Perspectives with THREE CSS3DRenderer

Talkat CSSConf.Asia 2014 · on Wednesday, 2014-11-19· [creative-coding, web-animation, css]
slides:none on file

three.js ships a CSS renderer that turns DOM elements into 3D by applying CSS 3D transforms so you can animate real HTML nodes instead of shaders and meshes; the renderer is tiny — ~80 KB gzipped — and runs on mobile and iOS, but it creates GPU layers via translateZ so performance hits appear (experiment shows 1,000 elements → ~10 FPS), rasterization causes pixelation when zoomed, IE lacks preserve-3d, and complex meshes are emulated by thousands of divs so it works but hits clear scaling limits.

AI-written summary · about

  1. 0:00Start
  2. 3:11Basics of three.js
  3. 12:523D Transforms
  4. 17:43Browser Bugs
~/search
type to search 6,249 conferences, 138,987 speakers and 185,172 talks
~/help
cmdctrl k
search every conference, speaker and series
/
focus the filter search
h
home
c
conferences
s
speakers
e
series
t
light / dark — the status bar button does the same
?
this help
esc
close this, then clear every filter — or just the search, while you are typing in it

Ignored while you are typing. Pages without a filter rail have no search to focus.