Connect with us

Разработка

Лучший Instagram для Android

Мы в Instagram провели весь прошлый год за переделкой и улучшением приложения для Android, чтобы оно отлично работало у всех пользователей, независимо от того, какие телефоны они используют или где находятся.

Анна Уханаева

Опубликовано

/

     
     
[pullquote align=right] Статья из инженерного блога Instagram.
[/pullquote]Android – это огромная экосистема с более чем 1 миллиардом активных пользователей на тысячах различных устройств. У людей, которые используют Android, есть невероятный выбор смартфонов, которые очень варьируются по скорости, набору функций или цене. Наиболее очевидной перменной является разрешение экрана, которое начинается от 240х320 до уже стандартных 1080х1920 точками – 27- кратная разница в количестве пикселей! На некоторых развивающихся рынках пользователи также сталкиваются с ненадежными сотовыми сетями. Все это означает, что поддержка пользователей на Android это, с одной стороны – техническая сложность, но с другой – это возможность для мобильных разработчиков, желающих завоевать весь мир.

Мы в Instagram провели весь прошлый год за переделкой и улучшением приложения для Android, чтобы оно отлично работало у всех пользователей, независимо от того, какие телефоны они используют или где находятся. Впервые мы поделились этой информацией на этой неделе на конференции @Scale.

Мы сосредоточились в нашей работе на двух ключевых областях: дизайне и времени запуска.

Дизайн

Обновляя шесть месяцев назад дизайн Instagram для Android, мы ставили перед собой три основные цели: ускорить приложение, сделать его красивее и учесть особенности работы на экранах разных размеров.

“Плоский дизайн” в последние годы становится все более популярным. Android, Windows Phone и iOS7 сменили сложные градиенты и тени на чистые цвета и плоские изображения. Кроме того, что это выглядит красиво на мобильных экранах, есть причина и поважнее: производительность. Плоский дизайн представляет контент, не отвлекая внимание на интерфейс. Отрисовка сплошного цвета происходит гораздо быстрее и занимает меньше памяти, чем загрузка и вывод на экран картинок-градиентов, хранящихся в памяти телефона. Простота означает меньше работы для железа, что приводит к ускорению работы приложения.

С этими целями мы переписали каждый экран в приложении. Мы сделали Instagram на Android красивым и плоским, убрали ненужные элементы управления, освободив пространство для фото и видео, и сконцентрировались на том, чтобы приложение выполняло меньше действий и, как следствие, работало быстрее.

Самая радикальная оптимизация пользовательского интерфейса произошла в процессах снятия фото/видео и редактирования. Мы переписали исходный макет так, чтобы учесть разные размеры экранов. Для этого мы разделили все экраны на четыре класса по пропорциям и разрешающей способности и оставили сжатую композицию только для самых маленьких экранов. В то же время средние и большие экраны получили расширенный интерфейс, использующий все доступные пиксели. В результате, большинству пользователей Instagram на Android теперь доступен более эргономичный процесс фотографирования и редактирования: все элементы управления находятся в зоне досягаемости для большого пальца.

В приложении широко используется изменение цвета элементов управления. В плоском мире все наши элементы являются просто формами, и мы можем менять их программно. Это позволяет нам унифицировать их внешний вид. Возможность изменения цвета элементов управления анонсируется как новая на ожидаемом Android L, но она уже была доступна на всех версиях Android. Вы можете применить цветные фильтры (ColorFilter) к Drawable-элементам или ImageView, и это изменит их представление. Мы сохраняем статически неизменные объекты цветовых фильтров в кэше и используем во всем приложении.

В конце концов, мы смогли значительно уменьшить количество элементов, необходимых для показа при запуске приложения. Изначальные 29 элементов для отображения названий и кнопок превратились в 8. Оказалось, что отказ от загрузки и вывода всех этих элементов при запуске приложения дает огромный выигрыш в скорости. Только это сократило время запуска, в среднем, на 120 мс (10-20%, в зависимости от устройства). Это ускорение чувствуется в работе всего приложения: например, пользовательские профили теперь загружаются в два раза быстрее.

Новый плоский дизайн и вышеописанные методики позволяют нам снизить объем исполняемого файла (APK) за счет меньшего количества рисунков. Мы сократили количество элементов в приложении наполовину, даже добавив при этом xxhdpi- элементы. Все изменения, в целом, позволили уменьшить размер APK в два раза. Это – огромный плюс для пользователей, которые платят за загрузку покилобайтно и должны ждать, пока приложение загрузится в медленных сетях.

Время запуска

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

Нам удалось сократить время запуска Instagram наполовину, сделав его самым быстрым мобильным приложением на телефоне. Instagram сейчас стартует и становится доступен для использования за 0.5 секунды на Galaxy S5 и за 1.5 секунды на Galaxy Y, старом устройстве, популярном на развивающихся рынках.

Чтобы достичь этого, мы провели много времени за изучением приложения, используя Android TraceView и наши собственные временные метки в коде. Мы сделали множество маленьких исправлений, таких как, например, переписывание неэффективного JSON-парсера или отказа от подгружающихся компонентов, которые не нужны для старта. Но было две области, которые потребовали креативного подхода.

Первая – это управлением «тяжелыми» системными сервисами – кешем изображений и видео, http-клиентом. Их необходимо инициализировать для работы приложения, правильно? На самом деле – неправильно, мы можем запустить приложение и взаимодействовать с ним без сетевых запросов или показа фотографий и видео. Это означает, что эти сервисы можно подгрузить уже в процессе работы. Однако мы не хотели усложнять программную модель и делать так, чтобы эти объекты были “null” при запуске. Так что, мы инициализировали их в два шага. Мы создаем их в главном потоке, как и раньше, но оставляем в неинициализированном состоянии, этого достаточно, чтобы API работали. Затем, когда мы уже раскручиваем отдельные потоки для загрузки изображений или содержания из сети, мы заканчиваем инициализацию, делая все самое тяжелое – загружая SSL сертификаты с диска или открывая и читая кеш.

Второй вещью, которую мы обнаружили, была наша страница новостей, которая действительно замедляла старт приложения. Страница новостей показывает, кто лайкает и комментирует ваши фотографии, и мы загружаем ее при старте, чтобы вы могли немедленно видеть новые активности. Новости изначально были сделаны, как webview, и после профилирования мы с удивлением обнаружили, что он создает множество потоков при старте, занимая время главного процессора. Мы поняли, что не можем управлять тем, как webview управляет важными системными ресурсами. Он разворачивает собственный сетевой стек, управляет собственным кешем изображений – во многом дублируя все то, что мы делаем в приложении. Чтобы исправить это, мы превратили новости в нативный экран. Это дало нам достаточно контроля для переноса загрузки новостей на тот момент, когда уже загрузилась основная лента, и использования тех же ресурсов приложения, вроде сетевого стека и кеша, что уже есть у приложения.

Все эти усилия совместно привели к тому, что приложение Instagram для Android стало более удобным. Простота – это главный принцип для наших инженеров и продуктовой команды. Мы продолжим прикладывать много усилий, подобных этим, к тому, чтобы Instagram был быстр и красив настолько, насколько это возможно, для всех пользователей.

Комментарии
Если вы нашли опечатку - выделите ее и нажмите Ctrl + Enter! Для связи с нами вы можете использовать info@apptractor.ru.
Advertisement
 
3 комментария

3 Comments

  1. Dmitrij

    21.09.2014 at 22:40

    Они слишком преувеличивают свои заслуги, особенно про уход от webview — вот это прям огромная оптимизация, а на деле инстаграм умудряется падать, так же как и нет нормального интерфейса для ipad.

You must be logged in to post a comment Login

Leave a Reply

Популярное

X
X

Спасибо!

Теперь редакторы в курсе.