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
86
The Mobile Development We Leave Behind
Avatar for Horia Dragomir hdragomir
0
52
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
Snowflake Marketplaceには”PODB”という便利なオープンデータがあってAI Ready対応してるらしいよ/the-snowflake-marketplace-has-a-useful-open-data-source-called-PODB-that-is-apparently-AI-ready
Avatar for shinyaa31 shinyaa31
0
270
ソフトウェアエンジニアとデータエンジニアの違い・キャリアチェンジ
Avatar for k.muguruma mtpooh
1
730
エンタープライズ企業における開発効率化のためのコンテキスト設計とその活用
Avatar for sergicalsix sergicalsix
1
160
us-east-1 の障害が 起きると なぜ ソワソワするのか
Avatar for Kazuki Miura miu_crescent
PRO
1
570
バクラクの AI-BPO を支える AI エージェント 〜とそれを支える Bet AI Guild〜
Avatar for Tomoaki tomoaki25
1
230
マイクロリブート ~ACEマインドセットで実現するアジャイル~
Avatar for ソニー株式会社 sony
0
170
Zabbix Conference Japan 2025 ダッシュボードコンテストLT
Avatar for Katato katayamatg
0
150
WordPress の Photo ディレクトリに 写真を登録してみよう
Avatar for TORIYAMA Yuko sysbird
1
140
QAエンジニアがプロダクト専任で チームの中に入ると。。。？/登壇資料（杉森 太樹）
Avatar for Hacobu hacobu
PRO
0
170
コード1ミリもわからないけど
Claude CodeでFigjamプラグインを作った話
Avatar for 都村　美帆 abokadotyann
1
150
Sansan BIが実践する AI on BI とセマンティックレイヤー / data_summit_findy
Avatar for Sansan R&D sansan_randd
0
130
Introducing RFC9111 / YAPC::Fukuoka 2025
Avatar for Ken’ichiro Oyama k1low
1
130

Featured

See All Featured
Easily Structure & Communicate Ideas using Wireframe
Avatar for Afnizar Nur Ghifari afnizarnur
194
16k
For a Future-Friendly Web
Avatar for Brad Frost brad_frost
180
10k
Building a Scalable Design System with Sketch
Avatar for Laura Van Doore lauravandoore
463
33k
What's in a price? How to price your products and services
Avatar for Michael Herold michaelherold
246
12k
BBQ
Avatar for Matthew Crist matthewcrist
89
9.9k
Side Projects
Avatar for Sacha Greif sachag
455
43k
Code Reviewing Like a Champion
Avatar for maltzj maltzj
527
40k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
Avatar for mongodb mongodb
48
9.8k
Large-scale JavaScript Application Architecture
Avatar for Addy Osmani addyosmani
514
110k
Build your cross-platform service in a week with App Engine
Avatar for Jose L jlugia
234
18k
The Invisible Side of Design
Avatar for Vitaly Friedman smashingmag
302
51k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
Avatar for Irina Nazarova irinanazarova
9
1k

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