• Аналитика в рознице: сегодня вы не купили презервативы, а магазин уже знает, когда вам пригодится скидка на детское питание


      Вот как-то так это хитро работает

      Про вашего будущего ребёнка – это, конечно, утрировано, но все может быть. На практике мы помогаем рознице бороться за каждый рубль с помощью математического аппарата. Вот, например, у вас в бумажнике есть карта лояльности, либо вы расплачиваетесь кредиткой. Это значит, что в целом магазин знает, сколько и каких продуктов вам надо. Дальше можно построить оптимальную модель вашего путешествия по магазину и понять, в какой ситуации вы купите больше. Что где должно стоять, какое молоко вы предпочитаете (вдруг вы готовы брать дорогое и натуральное без колебаний?) и так далее. Смоделировать вас по совокупности данных легко.

      Такую же аналитику можно применять ко всем аспектам работы розницы.

      Из смешного — один раз система просчитала, что будет выгодно уничтожить примерно полтонны бумаги. Сначала думали, что баг — но начали копать и выяснили, что поставщик даёт скидку за определённый порог закупки. А сеть может не успевать продавать нужное количество бумаги. С учётом стоимости склада, поставки и уровня скидки начиная с порога — проще взять и уничтожить кучу товара, чтобы получать его по цене ниже. Скидка минимум вдвое компенсирует убытки от его потери.
      Читать дальше →
    • Быстрый рендеринг с DOM шаблонизаторами

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


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

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

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

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

          Как и во многих других приложениях, нам в мобильном ICQ приходится хранить достаточно много информации: сообщения, контакты и тому подобное. Когда количество запросов к этим данным достигает какого-то критического значения, приложение начинает тормозить. Долгий запуск, медленное открытие чата, медленная отправка сообщений, постоянные спиннеры — все это жутко напрягает. Чаще всего причиной тормозов является неудачная работа с данными. В статье я хочу поделиться нашим опытом рефакторинга структуры данных, оптимизации запросов и некоторыми удобными приемами для миграции.

          Несколько слов об исходной задаче. Основная сущность у нас — профиль ICQ, у которого есть список контактов, а у тех есть сообщения. Наше приложение существует уже много лет, разрабатывалось разными людьми с разными подходами, номер версии основной БД уверенно приближался к 30. Кроме того, количество фич в продукте невозможно предсказать заранее, это тоже повлияло на архитектуру. В общем, модель данных изначально была примерно такой:

          Читать дальше →
          • +42
          • 22,4k
          • 8
        • А ваш AngularJS умеет работать на 3.5Mb ОЗУ?


            В начале весны 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-браузерах, за исключением одного НО —
            Читать дальше →
          • Загрузка JavaScript-файлов. Решаем проблему Ctrl-F5

              Все мы знаем сотню способов загрузки скриптов. У каждого свои плюсы и минусы.

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

              Цели: модульность разработки, быстрота загрузки, валидный кэш.
              Бонус: индикатор загрузки

              UPD. Обозначил главную цель этого метода — валидный кэш.
              При использовании данного метода, у вас не будет неуверенности в том, обновится ли скрипт и будет ли он работать у конечного пользователя.

              UPD 2. Для тех кто не дочитывает до конца (я вас прекрасно понимаю), в концовке сказано, как всё можно сделать намного проще.
              Вместо core.633675510761.js писать core.js?v=633675510761. И там же указано, почему всё же написано так много.

              UPD 3. В комментариях от david_mz, WebByte прозвучало предложение для обработки запроса использовать не JSHandler, а urlrewrite.

              Как сделать чтобы пользователь не нажимал Ctrl-F5, чтобы обновить ваш скрипт?
            • Оптимизация рендеринга веб-страницы

                image

                Из-за давления бизнеса, мы стремимся сделать всё быстрее. От этого страдает планирование и многие вещи не учитываются. Например, легко забыть о производительности и через какое-то время столкнуться с тем, что на более слабых машинах и планшетах обилие движущихся элементов страшно тормозит и дёргается в конвульсиях. Посмотрим, что можно сделать, если вы столкнулись с такой проблемой или хотели бы её избежать.
                Читать дальше →
              • Илья Григорик о внедрении HTTP/2

                  Известный специалист по серверной и клиентской оптимизации, соавтор WebRTC, автор книги "High Perfomance Browser Networking" Илья Григорик из Google опубликовал презентацию “HTTP/2 all the things!”, в которой объясняет, как следует настраивать серверную часть под HTTP 2.0, чтобы повысить скорость загрузки страниц и уменьшить latency, по сравнению с HTTP 1.1.


                  Режим Connection View в браузере показывает загрузку элементов заглавной страницы Yahoo.com в HTTP 1.1

                  Илья начинает с того, что для современных сайтов бóльшая часть задержек приходится на ожидание загрузки ресурсов, при этом полоса пропускания не является ограничивающим фактором (синим цветом на диаграмме Connection View). По статистике, для загрузки средней веб-страницы браузер делает 78 запросов к 12 различным хостам (общий размер загружаемых файлов 1232 КБ).
                  Читать дальше →
                • Сжатие при помощи canvas и PNG-картинок

                  • Перевод
                  Примечание: ниже находится перевод статьи «Compression using Canvas and PNG-embedded data». Автор предлагает на суд читателей еще один способ загрузить в клиентском браузере JavaScript-библиотеку, передав при этом минимум данных. Для этого используется PNG-картинка и объект canvas. Мои комментарии далее курсивом.

                  Сжатая JavaScript-библиотека в виде PNG-файла

                  Недавно у меня появилась идея, что можно хранить исходный Javascript-код в PNG-картинке, а затем получать его через метод getImageData() элемента canvas. К несчастью, сейчас это означает, что только такой подход будет работать только в Firefox, Opera Beta и последних ночных сборках WebKit. Пока еще никто не указал мне, насколько gzip опережает данный метод по степени сжатия, я хочу сразу сказать что рассматриваемый метод никак не может быть практической альтернативой физическому сжатию. Чуть раньше сегодня я уже писал о сжатой версии в 8Кб скрипта Super Mario, для которого использовалась эта техника (подробнее можно прочитать в заметке про кодирование). Здесь я приведу лишь некоторые детали о действительном положении вещей.

                  читать дальше на webo.in →
                • Один маленький проект: история продолжается, или сервис для людей

                    В первой заметке цикла было рассказано о том, как зародилась идея о создании сервиса Web Optimizator. Сейчас я хочу коснуться первых месяцев его роста и развития и тех проблем, с которыми столкнулся (или, наоборот, по счастливой случайности, не столкнулся). Итак, поехали.

                    WebSiteOptimization



                    В самом конце прошлого года идея создать онлайн-инструмент для проверки скорости загрузки сайта из чисто мнимой сущности все более становилось материальной. За пару дней был написан прототип, который анализировал пару сайтов и мог сказать, какие приемы на них применены и, что казалось более важным на тот момент, какие приемы нужно применить для ускорения загрузки сайта. Однако, вывод его был достаточно скуп и убог. Его нужно было как-то видоизменять.
                    Читать дальше →
                  • PostCSS. Будущее после Sass и Less

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


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

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

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

                      PostCSS – это второе поколение модульного процессора.
                      Читать дальше →
                    • Инструменты Intel для оптимизации приложений и задача о течениях в пористых средах

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

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



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

                        Если ваш сайт медленно грузится, вы рискуете тем, что люди не оценят ни то, какой он красивый, ни то, какой он удобный. Никому не понравится, когда все тормозит. Мы регулярно добавляем в Яндекс.Почту новую функциональность, иногда — исправляем ошибки, а это значит, у нас постоянно появляются новый код и новая логика. Все это напрямую влияет на скорость работы интерфейса.



                        Яндекс.Почту каждый день открывают миллионы человек из разных точек земного шара. И ни у кого она не должна тормозить, поэтому без различных измерений наша работа не обходится. В этом посте мы с alexeimoisseev и kurau решили рассказать о том, какие метрики у нас есть и какие задачи они решают. Возможно, это пригодится и вам.
                        Читать дальше →
                      • Blue Shift или оптимизация времени запуска iOS-приложения. Лекция Яндекса

                          Казалось бы, при загрузке приложения можно и потерпеть секунду-другую. Но когда ваша программа используется часто, а в конкурентах — аналог от производителя самой ОС, то даже время запуска начинает сказываться. Разработчик Яндекса Виктор Брыксин bobermaniac выступил на встрече сообщества CocoaHeads в офисе наших коллег в Mail.Ru и рассказал, как заставить iOS-приложение запускаться побыстрее.


                          — Долгое время я занимался разработкой Яндекс.Браузера. Собственно, из оптимизации времени старта этого приложения и родился мой доклад.
                          Читать дальше →
                        • Мобильный опыт Яндекса в трех видеокурсах: дизайн, разработка, интерфейсы

                          • Tutorial

                          В прошлом году Яндекс провел образовательный экспериментальный проект, который получил название «Мобилизация». Наша цель была в том, чтобы участники поработали в настоящей команде и создали настоящий продукт — причём продукт мобильный. «Мобилизация» объединила Школу мобильной разработки, Школу менеджеров, Школу мобильного дизайна и Школу разработки интерфейсов.


                          image


                          Мы пригласили 126 студентов из 25 городов; 91 участник успешно завершил программу. Первый этап состоял из лекций, второй — из той самой командной работы. Обычно студента окружают люди той же специализации, что и он сам: менеджеры учатся вместе с менеджерами, дизайнеры — с дизайнерами и т. д. Но в реальности вам нужно хотя бы по одному представителю нескольких профессий. В каждую команду вошли студенты разных школ: дизайнер, менеджер и один-два разработчика.


                          Лекции студентам читали сотрудники Яндекса, которые каждый день сталкиваются с реальными задачами и делают приложения для миллионов пользователей. Специально для читателей Хабра мы собрали полную программу курса по мотивам лекций «Мобилизации».


                          Читать дальше →
                          • +37
                          • 16,1k
                          • 6
                        • Рекордное время: как мы увеличили скорость запуска приложения Почты Mail.Ru на iOS



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

                            В статье речь пойдет об оптимизации большого по объему кода приложения, имеющего относительно долгую историю разработки и успевшего обрасти за это время множеством видимой и скрытой от пользователя функциональности. Задача состояла в том, чтобы сократить время запуска без урезания функциональности.
                            Читать дальше →
                            • +37
                            • 12,9k
                            • 9
                          • Data:URI CSS Sprites — современный подход к генерации CSS спрайтов

                              Мучения со стандартным подходом применения CSS спрайтов, а именно трудности модернизации и в некоторых случаях сложности оптимальной компоновки заставили искать альтернативный вариант оптимизации загрузки изображений. Очередной раз почитывая хабра-статьи, наткнулся на интересный подход реализации спрайтов с применением data:URI. В ходе дискуссий и умозаключений были определены слабые и сильные стороны данного подхода. Одним из значительных недостатков нового подхода является сложность сборки конечного CSS. Однако, при использовании data:URI имеет место возможность автоматизации процесса.
                              Читать дальше →
                            • Счетчик времени загрузки

                                Коллеги, други и просто хабралюди. С неделю назад на Web Optimizator был выложен код для счетчика загрузки (немного более подробно об измерении времени загрузки страницы можно прочитать в статьях про анализ скорости загрузки и разгон интернет-магазина).

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

                                Время загрузки Web Optimizator
                                График распределения пользователей webo.in по времени загрузки у них этого сайта

                                Читать дальше →
                              • Разгоняем CSS-селекторы: id против class, раунд второй

                                  В первой статье цикла я уже рассматривал скорость работы движка, ответственного за создание и отображение HTML-страницы на экране. Однако, сейчас речь пойдет о несколько другом аспекте, нежели движок CSS-селекторов. Данная серия тестов была посвящена скорости создания отдельного HTML-документа.

                                  Методика



                                  Если в первых двух исследованиях ставилась под вопрос скорость распознавания браузером CSS-правил и их применение, то сейчас интересовал другой вопрос, а именно: как быстро браузер создает DOM-дерево в зависимости от наличия в нем элементов с id или class?

                                  Для этого было подготовлено 3 набора HTML-файлов. Первый содержал 10000 элементов, у которых часть имеет id (количество именованных элементов варьировалось от 50 до 10000). Во втором HTML-файлы были, практически, идентичными, только вместо id имели атрибут class. В третьем наборе в DOM-дереве были только элементы с id (т.е. варьировалось само число элементов). Соответственно, все измерения проводились в скрытом iframe, чтобы избежать отрисовки загружаемой страницы на экране.

                                  читать дальше на webo.in →
                                • CSS: все о сжатии

                                    После статей «Практический CSS/JS: архивируем все!» и «JavaScript: жать или не жать» стало ясно, что проблема уменьшения CSS-файлов в размере действительно актуальна, и общественности хотелось бы аналогичного исследования уже конкретно для такой оптимизации. Которое, собственно, и приведено ниже.

                                    В интернете было найдено 6 различных инструментов для минимизации CSS-кода (однако, с одним из них, перловым модулем, разобраться не удалось, поэтому приведены результаты только для 5), далее ими обрабатывались несколько примеров, которые затем подвергались еще и архивированию. Результаты, опять-таки, представлены в виде графиков, ибо таблицы я нахожу менее информативными.

                                    График сжатия CSS-файлов

                                    читать дальше на webo.in →
                                  • JavaScript: жать или не жать?

                                      После публикации статьи на тему архивирования JS/CSS-файлов для последующей выдачи клиенту, я задумался на тему, какой же метод минимизации (minify) следует использовать. В докладе на конференции ClientSide'2007 не удалось установить четкого критерия, чем и как лучше всего сжимать JavaScript-файлы. Данная заметка посвящена рассмотрению как раз этой проблемы.

                                      Задача



                                      В качестве цели исследования был закреплен анализ всех известных средств статической минимизации JavaScript-кода, после чего нужно было ответить на три основных вопроса:

                                      • Имеет ли смысл пользоваться каким-либо минимизатором JS-кода?
                                      • Есть ли среди них универсальное средство, показывающее лучшие результаты в подавляющем большинстве случаев?
                                      • Если такого средства нет, то каковы критерии использования набора инструментов?


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

                                      читать дальше на webo.in →

                                    Самое читаемое