際際滷

際際滷Share a Scribd company logo

Mobile web apps tips & tricks

Darius Leskauskas
Darius Leskauskas

Kaunas PHP v2 Mobile web apps tips & tricks

1 of 11
Download to read offline
Darius Leskauskas @KaunasPHP HTML5 mobile apps. Tips & tricks
Apie mane Darius Leskauskas @darles Su WEB dirbu ~7 metus iuo metu dev@iTo
Pa転intis su mobile web app eskimi.com Socialinis tinklas su >10mln vartotoj迭
Mobile web app vs web app Riboti resursai: Atmintis Interneto greitis CPU Ribota ekrano rai邸ka 240x320 Did転iuliai ekrano rai邸k迭 skirtumai 240x320 -> 1280x720 Galyb skirting迭 nar邸ykli迭 ir j迭 versij迭 su savo "prii笛dais"
web VS native 90% funkcionalumo - atvaizdavimas Prieiga prie fail迭/foto kameros - neb笛tina Ribotas biud転etas + reikalingos visos platformos Aplikacijos dizainas - paprastas
Major bugs Nokia S60 - nepalaiko daugiau nei 3 sinchronini迭 ajax request迭. Nokia S60 - nepalaiko CORS The History API + .scrollTop was supported on 2.3.3 but is not on 3.0 or 4.0 border-width: 1px - ant retinos neveikia :) GIF animacija neveikia daugelyje android迭
Libraries jQuery - veikia visur :) Zepto - nei邸lipa i邸 RC, neveikia ant Nokia jQTouch - nei邸lipa i邸 BETA, neturi daug nauding迭 helperi迭 jQuery mobile - per daug suspausta strukt笛ra Sencha Touch - mokamas, nra dokumentacijos LESS
Extensions jq.history.js History.js jQuery versija. https://github.com/balupton/History.js matchMedia.js Rezoliucijos nustatymas https://github.com/paulirish/matchMedia.js mustache.js JS template'ai https://github.com/janl/mustache.js
Extensions fastClick.js http://labs.ft.com/ iScroll https://github.com/cubiq/iscroll CanvasLoader http://heartcode.robertpataki.com/canvasloader/
General tips Venkit animacij迭 ypa fadeIn/fadeOut Geriausias dizainas kur眺 gali nupie邸ti su HTML+CSS Jei naudojat t pat眺 canvas, nekurkit jo kiekvien kart prireikus - laikykit atmintyje Template'us arba generuokit su JS arba laikykit paiame JS'e Etalonas - m.linkedin.com scrollTo(0,1); - paslepiam address bar
Tools CodeKit - minimizavimas, LESS to CSS, JS append/prepend Mac OS X SpriteGen http://css.spritegen.com NetBeans

More Related Content

Mobile web apps tips & tricks

  • 2. Apie mane Darius Leskauskas @darles Su WEB dirbu ~7 metus iuo metu dev@iTo
  • 3. Pa転intis su mobile web app eskimi.com Socialinis tinklas su >10mln vartotoj迭
  • 4. Mobile web app vs web app Riboti resursai: Atmintis Interneto greitis CPU Ribota ekrano rai邸ka 240x320 Did転iuliai ekrano rai邸k迭 skirtumai 240x320 -> 1280x720 Galyb skirting迭 nar邸ykli迭 ir j迭 versij迭 su savo "prii笛dais"
  • 5. web VS native 90% funkcionalumo - atvaizdavimas Prieiga prie fail迭/foto kameros - neb笛tina Ribotas biud転etas + reikalingos visos platformos Aplikacijos dizainas - paprastas
  • 6. Major bugs Nokia S60 - nepalaiko daugiau nei 3 sinchronini迭 ajax request迭. Nokia S60 - nepalaiko CORS The History API + .scrollTop was supported on 2.3.3 but is not on 3.0 or 4.0 border-width: 1px - ant retinos neveikia :) GIF animacija neveikia daugelyje android迭
  • 7. Libraries jQuery - veikia visur :) Zepto - nei邸lipa i邸 RC, neveikia ant Nokia jQTouch - nei邸lipa i邸 BETA, neturi daug nauding迭 helperi迭 jQuery mobile - per daug suspausta strukt笛ra Sencha Touch - mokamas, nra dokumentacijos LESS
  • 8. Extensions jq.history.js History.js jQuery versija. https://github.com/balupton/History.js matchMedia.js Rezoliucijos nustatymas https://github.com/paulirish/matchMedia.js mustache.js JS template'ai https://github.com/janl/mustache.js
  • 9. Extensions fastClick.js http://labs.ft.com/ iScroll https://github.com/cubiq/iscroll CanvasLoader http://heartcode.robertpataki.com/canvasloader/
  • 10. General tips Venkit animacij迭 ypa fadeIn/fadeOut Geriausias dizainas kur眺 gali nupie邸ti su HTML+CSS Jei naudojat t pat眺 canvas, nekurkit jo kiekvien kart prireikus - laikykit atmintyje Template'us arba generuokit su JS arba laikykit paiame JS'e Etalonas - m.linkedin.com scrollTo(0,1); - paslepiam address bar
  • 11. Tools CodeKit - minimizavimas, LESS to CSS, JS append/prepend Mac OS X SpriteGen http://css.spritegen.com NetBeans