Рубрика «Клиентская оптимизация»

Он действительно огромный — просто посмотрите на него:
image
Эта штука весит 103кб (в сжатом виде). Больше чем код приложения — интернет-магазин -(58kb) и сравнима со всем остальным кодом в vendor бандле (156kb) — включающем react, react-dom, react-router, moment.js, lodash и кучу других библиотек. Что еще хуже — firebase нужен не на всех страницах, и очень часто не нужен к моменту загрузку сайта.

Читать полностью »

По мере того как наши сайты всё сильнее зависят от JavaScript, приходится расплачиваться за то, что мы отправляем пользователям, и иногда эта цена не видна с первого взгляда. В этой статье я объясню, почему полезно проявить немного дисциплины, если вы хотите ускорить загрузку и производительность на мобильных устройствах.

tl;dr: меньше кода = меньше парсинг/компиляция + меньше передача + меньше распаковка

Сеть

Когда большинство разработчиков думают о расходах на JavaScript, они размышляют о времени скачивания и выполнения. Отправка большего количества байт JavaScript занимает тем больше времени, чем тоньше канал с пользователем.

Цена JavaScript - 1

Это может стать проблемой даже в странах первого мира, поскольку эффективный тип сетевого соединения у пользователя необязательно 3G, 4G или WiFi. Вы можете сидеть в кафе с WiFi, но быть подключённым к хотспоту через сотовую связь со скоростью 2G.
Читать полностью »

Оптимизация фронтенда. Часть 2. Чиним tree-shaking в проекте на webpack - 1
Итак, если специально не чинить, tree-shaking в webpack не работает. Кто не верит, читайте мою предыдущую статью. Если починить очень хочется, то добро пожаловать под кат. Тут есть несколько вариантов, которые я смог подсмотреть, найти придумать. Читать полностью »

Оптимизация фронтенда. Часть 1. Почему я не люблю слово treeshaking или где вас обманывает webpack - 1
Мы относимся к технологиям, которые используем, как к покупкам на Яндекс маркете. Смотрим на спецификацию, читаем отзывы и, если проект получил много звездочек на гитхабе, проходит по спецификации, и к тому же внедрение стоит недорого, мы его  покупаем устанавливаем. Такой подход иногда очень сильно бьет по голове ручкой от граблей, и тогда все-таки приходится разбираться, что происходит.Читать полностью »

Лидерами не рождаются, ими становятся, и достигают этого те, кто стремится к совершенству. Немецкая компания Bosch Rexroth известна во всем мире, однако это не мешает ей и дальше работать над оптимизацией бизнес-процессов. Проблемы складского учета, знакомые каждой организации, затронули и российское представительство этой компании с крупным офисно-логистическим центром в городе Химки Московской области.

Команде Сканпорт поставили ответственную задачу – автоматизировать главные складские процессы на крупном логистическом складе компании. Представляем кейс с подробным описанием ключевых моментов и результатов нашей работы.

Bosch Rexroth выпускает разногабаритную продукцию: для ее учета нужен особый подход

Читать полностью »

Настраиваем Windows Server так, чтобы у вас все было, при этом вам за это ничего не было - 1

Parallels Parallels Remote Application Server (RAS) представляет из себя RDP с человеческим лицом, но некоторые его фишки должны быть настроены на стороне Windows Server (либо в виртуальных машинах, которые вы используете). Под катом рекомендации Матвея Коровина из команды техподдержки Parallels о настройках Windows Server при использовании RAS.Читать полностью »

Как быстрее DOM построить: парсинг, async, defer и preload - 1

На сегодняшний день, джентльменский набор по ускорению сайта включает в себя всё от минификации и оптимизации файлов до кеширования, CDN, разделения кода и так называемого tree shaking. Но даже если вы не знакомы с этой терминологией, значительного ускорения можно добиться и парой ключевых слов с продуманной структурой кода.

В Firefox скоро появится новый веб стандарт <link rel="preload">, который позволит загружать важные ресурсы быстрее. Его уже можно опробовать в версиях Firefox Nightly и Developer Edition, а пока это прекрасный повод вспомнить основы работы браузера и глубже понять о производительности при работе с DOM.
Читать полностью »

Для завоевания зарубежного рынка бизнесу необходимо не просто переводить тексты и интерфейсы на другие языки, но и адаптировать продукт под актуальные условия региона учитывая все особенности: денежные единицы, систему измерений, даты, даже традиции и религиозные нюансы. Кто-то все делает своими силами, кто-то нанимает переводчиков (а лучше носителей языка), а кто-то использует профессиональные платформы локализации. Одним из таких сервисов по автоматизации и управлению переводами является Lokalise. Опытом его внедрения поделились специалисты популярного международного фото- и видеобанка Depositphotos — менеджер по локализации Татьяна Гребенюк и web-разработчик Роман Дроголов. Итоги бесед с ними представлены в двух частях, первая из которых посвящена техническим аспектам разработки и интеграции Lokalise в проектную среду, а вторая – непосредственно вопросам переводов и взаимодействия с переводчиками.

Интеграция сервиса Lokalise в крупнейший фотобанк мира: опыт Depositphotos - 1

Depositphotos – это международный фото- и видеобанк, основанный украинским бизнесменом Дмитрием Сергеевым в 2009 году. Компания неоднократно привлекала крупные инвестиции от TMT Investments и Европейского Банка Реконструкции и Развития. Сейчас коллекция файлов Depositphotos насчитывает более 67 млн изображений и видео, а сама компания присутствует на двух десятках рынков по всему миру.
Читать полностью »

Виталий vithar Харисов — один из ключевых разработчиков и руководителей Яндекса. На московском Я.Субботнике по фронтенду Виталий рассказал про лёгкую версию поиска для медленных соединений и способы оптимизации кода, позволяющие уложиться в 10 килобайт.

Читать полностью »

Пользователи Lokalise могут выбирать, локализовать им свой продукт с привлечением наёмных переводчиков площадки, с собственной командой или исключительно своими силами. Именно для упрощения процедуры локализации тех проектов, где профессиональные переводчики не нужны и достаточно собственных знаний языка, мы и предоставляем нашим пользователям возможность использовать встроенные в Lokalise популярные системы машинного перевода от Google, Yandex, Microsoft и SDL. О том, как переводят эти системы, мы сегодня и поговорим на конкретных примерах.

«Чемодан из крокодиловой кожи» или «мешок с аллигатором»: сравнение подключенных к Lokalise онлайн-переводчиков - 1

Google Machine Translate/Google Neural Translate

Около полугода назад компания Google заявила о подключении очередного набора языков к нейронной сети своего сервиса Google Translate, в том числе и русского. Событие это стало знаковым для всего русскоязычного интернет-пространства: ежедневно тысячи человек пользуются встроенным в Chrome переводчиком Google или идут на сайт Google Translate за переводом иностранного текста на родной язык.
Читать полностью »