HTML5. Разработка приложений для мобильных устройств

Эмуляторы не могут смоделировать ограничения памяти и устройство, имеющее 100 открытых приложений. Проводите тесты с имеющими определенные пределы памятью и пропускной способностью. Проводите тесты на реальных устройствах

ImageAlpha и ImageOptim могут помочь конвертировать файлы больших размеров с прозрачными изображениями в PNG-формате в восьмиразрядные PNG-файлы с полной прозрачностью.

content delivery network (CDN).

Как правило, для устройств с ограниченной памятью рекомендуется использовать изображения размером не более 1024 пикселов в любом измерении.

Наибольшее влияние на повышение производительности оказывают оптимизация сайтов для работы на мобильных устройствах, сокращение количества HTTP-запросов и DNS-поисков.

var #160;isTouchEnabled #160;= #160;'apos;ontouchstart'apos; #160;in #160;window #160;|| #160; #160;'apos;createTouch'apos; #160;in #160;document #160;|| #160; #160; #160; #160;(window.DocumentTouch #160;&& #160;document #160;instanceof #160;DocumentTouch);

Для кнопок рекомендуется выбирать высоту 44 пиксела, минимальная их высота — 22 пиксела, наиболее приемлемо пространство между чувствительными зонами 20 пикселов (минимум 10 пикселов).

Если захочется заняться CSS-модулями speech, paged media и ruby, то с W3C-специ­#173;фикациями можно ознакомиться по адресам: http://www.w3.org/TR/css3-speech/, http://www.w3.org/TR/css3-page/ и http://www.w3.org/TR/css3-ruby

Хотя поддержка теней появилась еще на первых iPhone, тени могут занимать очень много памяти и подвешивать браузер, особенно если будут полупрозрачными, а не сплошными, и все это усугубляется, если элемент с тенью анимируется. Браузер при каждой перерисовке должен пересчитывать каждый пиксел, даже если тень становится невидимой. ВНИМАНИЕ Большие тени, особенно внутренние, используют большой объем памяти и могут подвесить мобильный браузер.

h1 #160;{ #160; #160;white-space: #160;nowrap; #160; #160;width: #160;180px; #160; #160;overflow: #160;hidden; #160; #160;-o-text-overflow: #160;ellipsis; #160;/* #160;opera #160;mini, #160;mobile #160;*/ #160; #160;text-overflow: #160;ellipsis; }