Скорость работы интернет-магазина на мобильных устройствах

Юрий Устинов Русоникс

Москва, 11 октября 2013

Советы по ускорению сайта

• Доклад на ЭТ-2012 ровно год назад

• АКТУАЛЬНО как никогда

• РАБОТАЕТ и для мобильных тоже

http://www.slideshare.net/rusonyx/ss-14834301

Так что с мобильными?

• Мобильное приложение

• Отдельная мобильная версия

• Адаптивный дизайн

• Обычный сайт для всех

ТОП100. Как у них?

1. ТОП100 Интернет-продавцов Рунета

по версии журнала «Секрет фирмы»

http://www.kommersant.ru/doc/2180938

ТОП100. Как у них?

1. ТОП100 Интернет-продавцов Рунета

по версии журнала «Секрет фирмы»

http://www.kommersant.ru/doc/2180938

2. Испытательный стенд

Приложение для iOS, iPhone 5, софт для имитации среднего 3G-соединения

ТОП 100. Статистика

из 100

имеют мобильную версию

Бытовая + электроника + компьютеры

из 37

имеют мобильную версию

Инструменты

из 2

имеют мобильную версию

Одежда

из 12

имеют мобильную версию

Туризм

из 13

имеют мобильную версию (все 3 – авиакомпании)

Интересный пример

16 сек 4 сек

Интересный пример

Сайт похож на приложение Приложение отдельно

Время «холодной» загрузки страницы

Время повторной загрузки страницы

Время загрузки на мобильном по сравнению с декстопом

92% мобильных сайтов открываются быстрее, чем обычная версия на компьютере

Время отображения страницы в среднем, сек.

Объем загружаемых данных в среднем, КБ

Ошибки. Жуткие редиректы

1. Редирект на www 2. Что-то очень долго происходит 3. Редирект на защищенный протокол https

ИТОГО: более 8 секунд до загрузки оформления (из 24 сек)

Ошибки. Жуткие редиректы

1. Редирект на www.laredoute.ru 2. Редирект на mobile.laredoute.ru/index.aspx 3. Редирект на mobile.redoute.ru/

ИТОГО: 3 секунды до загрузки оформления (из 11 сек)

Бить палками

Ошибки. Жуткие редиректы

1. Редирект на www.vasko.ru 2. Редирект на vasko.ru/m/ 3. Редирект на www.vasko.ru/m/

ИТОГО: 3,5 секунды до загрузки оформления (из 10 сек)

Бить палками

Ошибки. Половинчатая моб.версия

Мобильная версия при первом заходе

Полная версия при втором заходе

Бить или не бить?

Ошибки. Загрузка ненужной информации

Видим на экране: Загружаем реально на телефон

Бить палками

Ошибки. Адаптивный дизайн

• Это не только «бегающая-прыгающая» верстка

• Это замена иллюстраций

• Это изменение количества позиций на странице

• Это изменение объема данных в зависимости от

устройства

Ошибки. Неправильный вывод статики

1. Запрашиваем файл

www.eldorado.ru/static/css/main.css

2. Получаем редирект на файл

static.eldorado.ru/static/css/main.css

В результате ДВА запроса вместо одного по каждому файлу на странице (251 запрос!)

Бить палками

Полезное техдиру. Быстрый старт загрузки содержимого страницы

Загрузка HTML-кода страницы

Браузер ждет загрузки страницы и ничего не делает Бить не надо,

так «у всех»

Полезное техдиру. Быстрый старт загрузки содержимого страницы

Загрузка HTML-кода страницы

Заголовки страницы отдаются «принудительно» и начинается загрузка файлов со стилями. При этом страница еще не загрузилась целиком

Премировать, так у 40 из 100

Так что с мобильными?

• Мобильное приложение

• Отдельная мобильная версия

• Адаптивный дизайн

• Обычный сайт для всех

Юрий Устинов РУСОНИКС Facebook: yuri.ustinov rusonyx Twitter: @sukahitriy @rusonyx u@rsnx.ru www.rusonyx.ru

Спасибо, #oborot #et2013 :)