Все потоки
Поиск
Написать публикацию
Обновить
8.46

Клиентская оптимизация *

Делаем сайты удобнее и приятнее

Сначала показывать
Порог рейтинга
Уровень сложности

Государственный сайт, доступный для людей с ограниченными возможностями (чек-лист доступности)

Время на прочтение23 мин
Количество просмотров12K

Введение


В рамках “Дизайна госсистем” мы создали для вас (разработчиков всех видов) чек-лист доступности сайта для людей с ограниченными возможностями, который нужно прибить над рабочим столом каждого дизайнера и фронтендера. Он подходит к любым проектам (совсем не только государственным) в нем нет ничего лишнего. В нем только исключительно важная, критичная и полезная информация.
Так что печатайте, читайте и делитесь со своими коллегами.
Это крайне необходимые текст и знания.


Обработанный в Photoshop текст с применением фильтра blur
Читать дальше →

Google научился фильтровать фальшивые установки на Android

Время на прочтение4 мин
Количество просмотров22K


Магазин приложений Google Play Store, знакомый пользователям мобильной операционной системы Android, теперь способен распознавать и отфильтровывать установки мошеннических приложений. О расширении функциональности сообщили представители самой компании Google Казуси Нагаяма, аналитик качества поиска и Эндрю Ан, менеджер по продукту. Усовершенствование было представлено в последний день октября.
Читать дальше →

Select / Multiselect без JS

Время на прочтение4 мин
Количество просмотров20K

Я (и, как мне кажется, многие из вас) сталкивался не раз с несовместимостью селектов с дизайном сайта. Боль состоит в том, что их нельзя стилизовать, а в каждом браузере они выглядят по-своему.


Конечно, есть огромное количество решений, представляемых фреймворками/библиотеками (тот же бутстрап). Но все они предполагают наличие JSа. Разумеется, в этом нет ничего страшного/плохого, но я попробовал сделать стилизуемый селект без JS в качестве фоллбэка на случай, если js по каким-либо причинам сломается.

Читать дальше →

Asterisk и информация о входящих звонках в браузере

Время на прочтение8 мин
Количество просмотров25K
Прочитав заголовок, вы, наверное, подумаете «Избитая тема, да сколько можно об это писать», но всё равно не смог не поделиться своими велосипедами с костылями наработками.

Введение


В нашей компании запись клиентов осуществлялась по телефону через мини-атс (я в этом деле не силен и могу ошибаться). Все заказы сохранялись в базу данных, интерфейсом служит веб-приложение. Плотность звонков в определенные моменты бывает очень высока и диспетчеры, в силу человеческого фактора, не всегда правильно или не с первого раза записывают телефон клиента (когда он отображается на экране телефона).
Читать дальше →

Речевая аналитика как инструмент управления KPI контакт-центра. Кейс «Ростелеком»

Время на прочтение7 мин
Количество просмотров17K


Сегодня мы расскажем о том, как «Ростелеком Северо-Запад» повысил бизнес-показатели своего Единого Контакт-центра (ЕКЦ) с помощью инновационных технологий речевой аналитики. Подведены итоги консалтингового проекта, в рамках которого специалисты ЦРТ с помощью инструментов речевой аналитики Speech Analytics Lab проанализировали обращения клиентов в ЕКЦ «Ростелеком» и предложили методику улучшения качества обслуживания.

Зачем в КЦ нужна речевая аналитика?


ЕКЦ Северо-Западного филиала «Ростелеком» — огромная система, которая ежедневно обрабатывает тысячи обращений. При контроле качества супервизоры могут проанализировать только случайную выборку звонков, которая, как правило, составляет до 2% от общего числа обращений. А это не всегда даёт объективную картину.

С помощью инструментов речевой аналитики специалисты могут работать со 100% обращений. Для этого все диалоги ЕКЦ переводятся в текст и анализируются с помощью системы Speech Analytics Lab. Благодаря инструментам поиска в массивах неструктурированной речевой информации аналитик может отработать гипотезы (найти ключевые слова) на выборках в сотни тысяч фонограмм за несколько секунд.

На основе такого анализа можно разработать программу изменений для действующих в ЕКЦ процедур и процессов и оптимизировать системы самообслуживания (IVR, Личный кабинет, сайт).
Читать дальше →

Как спроектировать супер-быстрый сайт

Время на прочтение5 мин
Количество просмотров14K
Предлагаю вам перевод статьи How to Design Your Site to Make it Super-fast с сайта Awwwards, в которой говорится, как малыми средствами добиться большого результата в деле увеличения скорости работы вашего сайта. Данная статья скорее обращается к тем, кто не забывает про дизайн после утверждением макета, а продолжает работать над проектом вместе с разработчиками или сам является разработчиком.

Супер-быстрый сайт
Читать дальше →

Быстрый рендеринг с DOM шаблонизаторами

Время на прочтение17 мин
Количество просмотров32K

Борис Каплуновский (BSKaplou)


Борис Каплуновский

Я довольно долго работал над докладом и старался сделать его настолько противоречивым, насколько это возможно. И сразу начну с противоречия – я в корне не согласен с тем, что веб-компонентами можно пользоваться. Уже поднимался вопрос о 300 Кбайтах, я глубоко уверен, что 300 Кбайт для страницы Javascripta – недопустимо много.

Сегодня я расскажу о довольно глубоком путешествии во фронтенд. Началось это путешествие тогда, когда я обнаружил, что фронтенд aviasales.ru тормозит, и надо что-то делать. Это путешествие началось года полтора-два назад, и вещи, о которых я буду рассказывать, – это сжатое повествование того, что я узнал.

Самым критичным, на мой взгляд, в производительности фронтенд-приложений является рендеринг. Все мы знаем, что работа с DOM – это такая вещь, которую нужно стараться избегать. Чем больше вы делаете вызовов к DOM API, тем медленнее работает ваше приложение.

Инструменты Intel для оптимизации приложений и задача о течениях в пористых средах

Время на прочтение31 мин
Количество просмотров13K
Современные компьютерные системы, от обычного ноутбука до вычислительного кластера, рассчитаны на параллельную обработку данных. Поэтому, чем полнее программы задействуют эту возможность, тем больше у них шансов раскрыть потенциал существующих аппаратных решений. Однако, прежде чем переходить к параллельной схеме исполнения кода, этот код должен максимально эффективно работать в однопоточном режиме. Иначе увеличение числа потоков не даст ожидаемого роста производительности.

Оптимизации, которые влияют на скорость вычислений при использовании любого числа потоков, сводятся к учёту в коде особенностей процессорных архитектур, наборов инструкций, к поиску наиболее рациональных способов работы с разными видами памяти. Помощь в подобной оптимизации способен оказать, например, подход к исследованию производительности методом «сверху вниз» с использованием низкоуровневых данных о системных событиях, которые преобразуются в доступные для анализа и практического применения высокоуровневые показатели.



Здесь мы рассмотрим методику оптимизации вычислений, связанных с моделированием течений многофазных жидкостей в пористых средах по методике, предложенной в этой работе. Речь идёт о численном методе решения дифференциальных уравнений гиперболического типа в частных производных.
Читать дальше →

PostCSS. Будущее после Sass и Less

Время на прочтение11 мин
Количество просмотров52K

Андрей Ситник (Iskin, Злые марсиане)


Андрей Ситник

В 2013 году Holowaychuk анонсировал свой проект Rework в статье «Модульный CSS-препроцессинг с Реворком» (http://tjholowaychuk.tumblr.com/post/44267035203/modular-css-preprocessing-with-rework ).

Как раз тогда я искал какой-то инструмент для того, чтобы сделать автопрефиксер. Когда я прочитал эту статью, я был поражен, потому что это был действительно революционный подход, он менял все. И поэтому первые версии автопрефиксера базировались на Rework’е. Но, к сожалению, Rework – это был Proof Of Concept, это было первое поколение, чтобы доказать, что это вообще работает. Поэтому мы его жестко форкнули, переманили всех разработчиков, устроили маленькую революцию и сделали PostCSS.

PostCSS – это второе поколение модульного процессора.

Внедряем Brotli с помощью Nginx — экономим байты почти бесплатно

Время на прочтение5 мин
Количество просмотров46K
Эта статья пригодится всем, кто неравнодушен к скорости доставки своего веб-приложения пользователю и хочет выжать дополнительные миллисекунды и килобайты экономии.


Читать дальше →

Представляем RAIL: модель оценки производительности сайта

Время на прочтение8 мин
Количество просмотров7.9K

В последнее время публикуется множество советов по оптимизации производительности сайтов. Фразы вроде «DOM работает слишком медленно» или «всегда используйте CSS-анимацию» годятся в виде броских заголовков, но истинное положение вещей содержит различные нюансы.


Представляем статью авторства Пола Айриша и Пола Льюиса из команды Google Chrome о разработанной ими модели оценки производительности сайта. Ее можно с уверенностью назвать User-Centered Performance.

Читать дальше →

Рекордное время: как мы увеличили скорость запуска приложения Почты Mail.Ru на iOS

Время на прочтение21 мин
Количество просмотров16K


Скорость запуска — критически важный фактор для долгосрочного успеха приложения. Она особенно важна для таких приложений как Почта Mail.Ru, которые запускают по многу раз в день с целью быстро проверить новые письма во «Входящих».

В статье речь пойдет об оптимизации большого по объему кода приложения, имеющего относительно долгую историю разработки и успевшего обрасти за это время множеством видимой и скрытой от пользователя функциональности. Задача состояла в том, чтобы сократить время запуска без урезания функциональности.
Читать дальше →

Особенности файловых систем, с которыми мы столкнулись при разработке механизма синхронизации Облака Mail.Ru

Время на прочтение8 мин
Количество просмотров22K


Одна из основных функций десктопного клиента Облака Mail.Ru — синхронизация данных. Ее целью является приведение папки на ПК и ее представления в Облаке к одинаковому состоянию. При разработке этого механизма мы встретились с некоторыми, с первого взгляда, достаточно очевидными особенностями различных файловых и операционных систем. Однако если о них не знать, можно столкнуться с довольно неприятными последствиями (не получится загрузить или удалить файл). В этой статье мы собрали особенности, знание которых позволит вам правильно работать с данными на дисках и, возможно, убережет от необходимости срочного хотфикса.
Читать дальше →

Ближайшие события

Как оптимизировать игру с помощью полигональных атласов

Время на прочтение5 мин
Количество просмотров31K
Как всем известно, жизнь разработчика мобильных игр непроста. Он должен найти свой путь на очень узкой дорожке. С одной ее стороны — требования гейм-дизайнеров, уверенно устремляющиеся к бесконечности. Больше функционала, больше красивой графики, больше эффектов, больше анимаций, больше звуков. А с другой стороны — ограниченные ресурсы мобильного устройства. И раньше всего, как правило, заканчивается оперативная память.

Например, iPad 2 — всего в нем 512 Мб RAM. Однако приложению доступно только примерно 275 Мб. Когда занимаемая приложением память будет приближаться к этой границе, операционная система пришлет так называемое «Memory warning» — мягко, но настойчиво предложит освободить память. И если лимит все же будет превышен, операционная система остановит приложение. Пользователь будет думать, что ваша игра упала и побежит писать гневное письмо в саппорт.



Главный потребитель памяти — это, конечно, графика. В этой статье мы попробуем рассказать о пусть немного сложном, но эффективном способе, который используется для уменьшения занимаемой текстурами памяти, а также для повышения скорости отрисовки.
Читать дальше →

Переходим на WebMarkupMin 2.X

Время на прочтение22 мин
Количество просмотров3.9K
Логотипы WebMarkupMin, .NET Core и NUglify
Весной прошлого года, когда ASP.NET 5 был еще в стадии Beta 3, я начал получать от пользователей письма с просьбами сделать WebMarkupMin совместимым с DNX 4.5.1 и DNX Core 5.0. Основной проблемой было то, что новый .NET не поддерживал настройку с помощью конфигурационных файлов App.config и Web.config. Переписывание WebMarkupMin.Core, WebMarkupMin.MsAjax и WebMarkupMin.Yui не должно было представлять особой сложности, потому что нужно было просто удалить весь код, использующий библиотеку System.Configuration. Серьезные проблемы должны были возникнуть при переписывании ASP.NET-расширений, потому что для них нужно было разработать совершенно новую модель конфигурации, а это, в свою очередь, требовало очень серьезных изменений в архитектуре. Эти изменения затрагивали не только код, но и структуру решения и NuGet-пакеты, поэтому я решил начать с чистого листа и сделал репозиторий на GitHub. На тот момент, до релиза стабильной версии нового ASP.NET оставалось как минимум полгода, поэтому нужно было одновременно поддерживать 2 ветви WebMarkupMin: стабильную 1.X на CodePlex и предварительную 2.X на GitHub.

Как известно всем, выход стабильных версий .NET и ASP.NET Core 1.0 задержался еще на несколько месяцев и состоялся только в конце июня этого года. Вслед за релизом этих фреймворков, состоялся и релиз WebMarkupMin 2.0. В этой статье я расскажу вам о том, как обновить существующие приложения под WebMarkupMin 2.X, а также как добавить его в веб-приложения, написанные на ASP.NET Core.

Критические изменения и нововведения


Для того чтобы установить пакеты WebMarkupMin 2.X вам необходимо обновить NuGet Package Manager до версии 2.8.6 или выше.

Основным критическим изменением версии 2.X стал отказ от использования файлов Web.config и App.config для настройки WebMarkupMin. Теперь при настройке вместо декларативного подхода (использование конфигурационных файлов) используется императивный подход (использование программного кода).
Читать дальше →

Выбираем лучший онлайн-сервис по сжатию CSS

Время на прочтение2 мин
Количество просмотров57K
сжатие css


В настоящее время существует огромное количество веб-инструментов по оптимизации CSS файлов. Большинство из них имеют собственный алгоритм работы (есть, конечно, и дубликаты). Эффективность самих программ тоже значительно отличается. Кроме того, некоторые оптимизаторы могут «ломать» CSS код, после чего стили становятся невалидными. Как показывает практика, процент таких «полезных» инструментов достаточно высок.

Данная статья представляет собой отчет о проведенном тестировании наиболее популярных онлайн-оптимизаторов. Эксперимент проводился на 3 CSS файлах. Ссылки на каждый из них приведены в таблице результатов.
Читать дальше →

Кэш, хэш и няш-меш

Время на прочтение6 мин
Количество просмотров14K

UPD0 (2016-07-19 23-31): судя по всему, первая половина моей статьи — успешно изобретённый велосипед. Спасибо хабравчанам за ссылку на спецификацию
Статья ценна не более, чем вольное описание уже придуманной технологии.


Предыстория


Июльский субботний вечер подходил к концу. Нарубив дров на шашлык, я повесил USB-модем на багету, скомандовал sudo wvdial, развернул браузер и обновил вкладку с открытым гитхабом. Вернее, попытался обновить. Скорость не радовала, и в итоге страница-то обновилась, но явно не хватало какого-то из стилевых файлов; и дело было не в блокировке, поскольку аналогичные проблемы я наблюдал и с другими сайтами, и зачастую они решались просто многократным обновлением страницы. Во всём был виноват перегруз 3G-сети.


Стоп! А как же кэш?

Читать дальше →

Улучшение путей взаимодействия пользователя (user flow) через переходы по странице

Время на прочтение9 мин
Количество просмотров18K

Пост является переводом статьи "Improving User Flow Through Page Transitions" со Smashing Magazine о создании плавных переходов. Автор этой статьи, Луиджи Де Роза, является фронт-энд разработчиком в EPIC. Далее повествование будет идти от лица автора статьи. Приятного чтения.

Читать дальше →

А ваш AngularJS умеет работать на 3.5Mb ОЗУ?

Время на прочтение15 мин
Количество просмотров24K

В начале весны ABBYY LS совместно с Xerox запустили сервис для перевода документов Xerox Easy Translator Service. Изюминкой этого сервиса является приложение, запускаемое на МФУ Xerox и позволяющее отсканировать необходимое количество документов, дождаться перевода на один из выбранных 38 языков, произвести печать перевода — и все это не отходя от МФУ.

Приложение запускается на определенной серии МФУ Xerox на основе технологии Xerox ConnectKey с сенсорным экраном 800x480 точек. Аппаратная начинка МФУ зависит от конкретной модели, например, наша тестовая малютка Xerox WorkCentre 3655 имеет на борту 1Ghz Dual Core процессор и 2Gb оперативной памяти. Как ни удивительно, но МФУ имеет встроенный webkit-браузер, а наше приложение — это обычное html-приложение, разработанное на AngularJS 1.3.15.

О самом проекте мы писали в блоге раньше, а эта статья посвящена одному из увлекательных этапов проекта, а именно оптимизации AngularJS под работу на МФУ Xerox. Как оказалось на деле, платформа МФУ практически не накладывает никаких серьезных ограничений на разработку приложений, и они работают практически так же, как и на десктопных webkit-браузерах, за исключением одного НО —
Читать дальше →

Чем полезен мономорфизм?

Время на прочтение14 мин
Количество просмотров32K


Выступления и посты в блогах о производительности JavaScript часто обращают внимание на важность мономорфного кода, однако обычно не дается внятного никакого объяснения, что такое мономорфизм/полиморфизм и почему это имеет значение. Даже мои собственные выступления зачастую сводятся к дихотомии в стиле Невероятного Халка: «ОДИН ТИП ХОРОШО! ДВА ТИП ПЛОХО!». Неудивительно, что когда люди обращаются ко мне за советом по производительности, чаще всего они просят объяснить, что на самом деле такое мономорфизм, откуда берется полиморфизм и что в нем плохого.

Ситуацию осложняет еще и то, что само слово «полиморфизм» имеет множество значений. В классическом объектно-ориентированном программировании полиморфизм связан с созданием дочерних классов, в которых можно переопределить поведение базового класса. Программисты, работающие с Haskell, вместо этого подумают о параметрическом полиморфизме. Однако полиморфизм, о котором предупреждают в докладах о производительности JavaScript – это полиморфизм вызовов функции.

Я объяснял этот механизм столькими различными путями, что наконец-то собрался и написал данную статью: теперь можно будет не импровизировать, а просто дать на нее ссылку.

Я также попробовал новый способ объяснять вещи – изображая взаимодействие составных частей виртуальной машины в виде коротких комиксов. Кроме того, данная статья не покрывает некоторые детали, которые я посчитал незначительными, излишними или не связанными напрямую.
Читать дальше →

Вклад авторов