0
Darius Leskauskas@KaunasPHPHTML5 mobile apps. Tips & tricks
Apie maneDarius Leskauskas @darlesSu 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● ...
web VS native● 90% funkcionalumo - atvaizdavimas● Prieiga prie failų/foto kameros - nebūtina● Ribotas biudžetas + reikalin...
Major bugs● Nokia S60 - nepalaiko daugiau nei 3  sinchroninių ajax requestų.● Nokia S60 - nepalaiko CORS● The History API ...
Libraries● jQuery - veikia visur :)   ○ Zepto - neišlipa iš RC, neveikia ant Nokia   ○ jQTouch - neišlipa iš BETA, neturi ...
Extensions● jq.history.js   ○ History.js jQuery versija.     ■ https://github.com/balupton/History.js● matchMedia.js   ○ R...
Extensions● fastClick.js   ○ http://labs.ft.com/● iScroll   ○ https://github.com/cubiq/iscroll● CanvasLoader   ○ http://he...
General tips● Venkit animacijų ypač fadeIn/fadeOut● Geriausias dizainas kurį gali nupiešti su  HTML+CSS● Jei naudojat tą p...
Tools● CodeKit - minimizavimas, LESS to CSS, JS  append/prepend  ○ Mac OS X● SpriteGen  ○ http://css.spritegen.com● NetBeans
Upcoming SlideShare
Loading in...5
×

Mobile web apps tips & tricks

290

Published on

Kaunas PHP v2
Mobile web apps tips & tricks

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
290
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
2
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Transcript of "Mobile web apps tips & tricks"

  1. 1. Darius Leskauskas@KaunasPHPHTML5 mobile apps. Tips & tricks
  2. 2. Apie maneDarius Leskauskas @darlesSu WEB dirbu ~7 metusŠiuo metu dev@iTo
  3. 3. Pažintis su mobile web app● eskimi.com● Socialinis tinklas su >10mln vartotojų
  4. 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 "pričiūdais"
  5. 5. web VS native● 90% funkcionalumo - atvaizdavimas● Prieiga prie failų/foto kameros - nebūtina● Ribotas biudžetas + reikalingos visos platformos● Aplikacijos dizainas - paprastas
  6. 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. 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, nėra dokumentacijos● LESS
  8. 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 templateai ■ https://github.com/janl/mustache.js
  9. 9. Extensions● fastClick.js ○ http://labs.ft.com/● iScroll ○ https://github.com/cubiq/iscroll● CanvasLoader ○ http://heartcode.robertpataki.com/canvasloader/
  10. 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● Templateus arba generuokit su JS arba laikykit pačiame JSe● Etalonas - m.linkedin.com● scrollTo(0,1); - paslepiam address bar
  11. 11. Tools● CodeKit - minimizavimas, LESS to CSS, JS append/prepend ○ Mac OS X● SpriteGen ○ http://css.spritegen.com● NetBeans
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×