Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Games, Apps and HTML5

Avatar for Horia Dragomir Horia Dragomir
September 14, 2012
Technology
5
1.2k

Games, Apps and HTML5

These are the support slides for my talk at PhoneGap Day EU 2012 in Amsterdam.
Avatar for Horia Dragomir

Horia Dragomir

September 14, 2012
Tweet

More Decks by Horia Dragomir

See All by Horia Dragomir
The Mobile Development We Leave Behind (FrontTrends 2014)
Avatar for Horia Dragomir hdragomir
0
85
The Mobile Development We Leave Behind
Avatar for Horia Dragomir hdragomir
0
49
Fast Mobile UIs
Avatar for Horia Dragomir hdragomir
8
1.8k
Technology is Your Office
Avatar for Horia Dragomir hdragomir
2
320

Other Decks in Technology

See All in Technology
Delegating the chores of authenticating users to Keycloak
Avatar for Alexander Schwartz ahus1
0
130
LangSmith×Webhook連携で実現するプロンプトドリブンCI/CD
Avatar for sergicalsix sergicalsix
1
200
面倒な作業はAIにおまかせ。Flutter開発をスマートに効率化
Avatar for Rui ruideengineer
0
120
敢えて生成AIを使わないマネジメント業務
Avatar for Kazuki Maeda kzkmaeda
1
260
Tech-Verse 2025 Keynote
Avatar for LINEヤフーTech (LY Corporation Tech) lycorptech_jp
PRO
0
1.7k
20250707-AI活用の個人差を埋めるチームづくり
Avatar for shnjtk shnjtk
3
3.1k
「良さそう」と「とても良い」の間には 「良さそうだがホンマか」がたくさんある / 2025.07.01 LLM品質Night
Avatar for Shumpei Miyawaki smiyawaki0820
1
490
さくらのIaaS基盤のモニタリングとOpenTelemetry/OSC Hokkaido 2025
Avatar for FUJIWARA Shunichiro fujiwara3
2
310
無意味な開発生産性の議論から抜け出すための予兆検知とお金とAI
Avatar for Masato Ishigaki / 石垣雅人 i35_267
3
11k
Yamla: Rustでつくるリアルタイム性を追求した機械学習基盤 / Yamla: A Rust-Based Machine Learning Platform Pursuing Real-Time Capabilities
Avatar for LINEヤフーTech (LY Corporation Tech) lycorptech_jp
PRO
4
220
Southwest airlines®️ USA Contact Numbers: Complete 2025 Support Guide
Avatar for Nitish oliversmith12
0
110
2025-07-06 QGIS初級ハンズオン「はじめてのQGIS」
Avatar for kou_kita kou_kita
0
150

Featured

See All Featured
Faster Mobile Websites
Avatar for Dean Hume deanohume
307
31k
Designing for Performance
Avatar for Lara Hogan lara
610
69k
Testing 201, or: Great Expectations
Avatar for Joseph Mastey jmmastey
42
7.6k
Save Time (by Creating Custom Rails Generators)
Avatar for Garrett Dimon garrettdimon
PRO
31
1.3k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
Avatar for Rebecca Miller-Webster rmw
34
3.1k
Scaling GitHub
Avatar for Zach Holman holman
459
140k
Product Roadmaps are Hard
Avatar for C. Todd Lombardo iamctodd
PRO
54
11k
VelocityConf: Rendering Performance Case Studies
Avatar for Addy Osmani addyosmani
332
24k
Optimising Largest Contentful Paint
Avatar for Harry Roberts csswizardry
37
3.3k
ピンチをチャンスに：未来をつくるプロダクトロードマップ #pmconf2020
Avatar for Aki / @LoveIdahoBurger aki_iinuma
126
52k
Practical Tips for Bootstrapping Information Extraction Pipelines
Avatar for Matthew Honnibal honnibal
PRO
20
1.3k
Visualization
Avatar for Eitan Lees eitanlees
146
16k

Transcript

  1. Games & HTML5

  2. @hdragomir

  3. None
  4. None
  5. None
  6. None

  7. .scrollTo(0, 0)

  8. speed

  9. None

  10. http hates you

  11. None

  12. applicationCache is a lie

  13. applicationCache is a lie https://vimeo.com/43336762

  14. Golf Everything! 140byt.es

  15. None

  16. jQuery

  17. None

  18. .querySelectorAll()

  19. .querySelectorAll() http://snook.ca/archives/javascript/going-simple-with-javascript

  20. getElementsByClassName

  21. getElementById

  22. None

  23. events bubble

  24. XMLHttpRequest rocks the boat

  25. req.responseCode < 400

  26. pushState

  27. requestAnimationFrame

  28. Redraws Hate You

  29. CSS is your friend

  30. Animations are hard

  31. Also, cheat and add dummy transforms just to get things

    HW accelerated

  32. matrix3d(0.8, 0, ...

  33. None

  34. data-mode=”super-duper”

  35. CSS gets lazy

  36. small hacks go a long way

  37. None
  38. None
  39. None

  40. onclick

  41. touchstart touchend touchmove

  42. hammer.js

  43. touchend

  44. perceived responsiveness

  45. perceived responsiveness http://alexmaccaw.co.uk/posts/async_ui

  46. pointer-events: none; user-select: none; user-drag: none;

  47. name=viewport content="initial-scale=0.5"

  48. device-pixel-ratio

  49. navigator.connection

  50. None

  51. Firefox OS

  52. WebApps

  53. WebApps http://singlepageappbook.com/

  54. You should be an edge case

  55. You should be an edge case @hdragomir @wooga this means

    you're doing something special