• Service Workers. Инструкция по применению



      Количество выходов в интернет с мобильных устройств ежегодно растёт на 2-4% в год. Качество связи не успевает за такими темпами. Как итог, даже самое лучшее веб-приложение обеспечит ужасный опыт, если пользователь не сможет его загрузить.

      Проблема в том, что до сих пор нет хорошего механизма управления кэшем ресурсов и результатов сетевых запросов. В своей статье я хочу рассказать как Service Worker (SW) может помочь в решении этой задачи. Объясню в формате рецептов — какие элементы и в какой пропорции смешать, чтобы получить нужный результат, исходя из задачи и требований.
      Поехали!
    • Эффективное тестирование верстки

        Тестировать полезно. Тесты позволяют в автоматическом режиме безопасно рефакторить код и гарантируют его работу. Тесты – это живая документация: если информация в Wiki или в Confluence может устареть, то тесты всегда актуальны. Также многие крутые практики связаны с тестированием. Например, самотестирующийся код или разработка через тестирование (TDD), когда тесты пишутся перед кодом, а некоторые практики DevOps и Extreme Programming применимы только в условиях хорошего покрытия проекта тестами.



        Но написать простые тесты, которые будут помогать в написании кода и не срывать дедлайны, задача сложная. Она становится ещё сложнее, если учесть, что нам приходится тестировать вёрстку. Это не два JSON сравнить: здесь не работают простые подходы «вызову функцию, проверю результат» — тестирование UI сложнее. Как эффективно и правильно тестировать верстку и писать для неё тесты, чтобы они были полезны, а дедлайны не горели, расскажет Максим Соснов (crazymax11), ведущий разработчик в СКБ Контур.
        Читать дальше →
        • +21
        • 9.4k
        • 8
      • Дэн Абрамов о замыканиях в JavaScript

        • Translation
        Замыкания вызывают у программистов сложности из-за того, что это — «невидимая» конструкция.

        Когда вы используете объект, переменную или функцию, вы делаете это намеренно. Вы думаете: «Тут мне понадобится переменная» — и добавляете её в свой код.



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

        Если в двух словах, то замыкание — это когда функция обращается к переменным, объявленным за её пределами. Например, замыкание содержится в этом фрагменте кода:

        let users = ['Alice', 'Dan', 'Jessica'];
        let query = 'A';
        let user = users.filter(user => user.startsWith(query));
        

        Обратите внимание на то, что user => user.startsWith(query) — это функция. Она использует переменную query. А эта переменная объявлена за пределами функции. Это и есть замыкание.

        Вы, если хотите, можете дальше не читать. Оставшаяся часть этого материала рассматривает замыкания в другом свете. Вместо того чтобы говорить о том, что такое замыкания, эта часть статьи посвятит вас в подробности методики обнаружения замыканий. Это похоже на то, как, в 1960-х, работали первые программисты.
        Читать дальше →
      • Делим Laravel на компоненты

        Привет, Хабр. Недавно получил в руки интересный проект, который, несмотря на свою простоту требовал не использовать какой-либо фреймворк. О пакетах речи не шло, поэтому было принято решение использовать привычные компоненты Laravel. Если есть необходимость в использовании очередей, Eloquent или контейнера — добро пожаловать под кат.

        Читать дальше →
      • Организация маршрутов в Laravel

        Здравствуй, Habr. Недавно я согласился на ревью сайта, заказанного на фрилансе. Я ожидал увидеть контроллеры, которые делают вообще все и занимают 200+ строк (и прочие проявления плохого кода), но все было вполне прилично. Валидация не лежала в контроллере, что встречается достаточно часто. Иногда, конечно, встречались некоторые несоответствия PSR-2, но все выглядело нормально, пока я не заглянул в файл с маршрутами. Он занимал несколько экранов и имел комментарии о группах маршрутов. Я связался с разработчиком и он сказал, что все немного «разрослось» и согласился поправить. В следующей версии я увидел, что он создал несколько классов со статическими методами, в которые переложил код и вызвал их, как это обычно делается, с авторизацией. Тут я вспомнил, что уже сталкивался с подобным и встречал такую аргументацию: «В документации ничего не говорится о вынесении маршрутов в разные файлы». Буквально через пару минут я нашел статью и отправил разработчику. Через пол часа я получил маршруты в нормальном виде и принял решение, что многим новичкам эта статья будет полезна. Так родился этот вольный перевод.

        Если вы ни разу не правили файл RouteServiceProvider, добро пожаловать под кат.
        Читать дальше →
      • «Молчание – золото»: 13 вещей, которые не стоит говорить разработчикам и тестировщикам



          / фото Sistema Bibliotecario Vimercatese CC

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

          Работа в команде – ответственное занятие, поскольку в этом случае люди отвечают не только за себя, но и за окружающих, они общаются, помогают друг другу. Как бы это ни было банально, ключом к продуктивному общению между людьми всегда является вежливость и взаимоуважение. Однако все же есть определенный список фраз, которые – даже когда они звучат вежливо и корректно – не стоит употреблять в разговоре с разработчиками и тестировщиками, если вы их коллега, заказчик, «владелец» или руководитель проекта.
          Читать дальше →
        • Пошаговый план старта на Upwork

          • Tutorial
          image

          Рано или поздно разработчик всерьез задумывается о фрилансе. В этот момент большинство идут на биржи. Выбор бирж огромен. В СНГ: fl.ru, weblancer и прочие. Но когда доходишь до дела начинаешь понимать в каком все упадке. Единственным местом где водятся более-менее нормальные заказы можно назвать fl.ru и еще одну-две биржы. Но на fl.ru нужен pro аккаунт, ведь оказывается чтобы взять заказ нужно заплатить бирже, и далеко не факт что тебе что-то светит. Поэтому было решено идти на Upwork.
          Читать дальше →
        • CSS и iOS Safari

            image Доброго времени суток, дорогие хабрахабровцы!

            Всегда хочется, что бы твой сайт выглядел одинаково хорошо на разных устройствах, включая и мобильные. Но, если поведение в браузерах Android во многом предсказуемо, то с iOS возникает ряд «сюрпризов». О них сегодня и поговорим!
            Читать дальше →
          • JavaScript: элементы стиля

            • Translation
            В 1920-м году вышла книга Уильяма Странка-младшего «Элементы стиля». Рекомендации из неё, касающиеся английского языка, актуальны и сегодня. Те же принципы, применённые к коду, позволяют повысить качество программ.

            image

            Надо заметить, что речь не идёт о жёстких правилах. То, о чём мы сегодня поговорим — лишь рекомендации. Даже если вы решите следовать им, вполне могут найтись веские причины для того, чтобы от них отклониться, например, если это поможет сделать код понятнее. Однако, поступая так, будьте бдительны и помните о том, что люди подвержены когнитивным искажениям. Например — выбирая между обычными и стрелочными функциями в JavaScript, тот, кто не очень хорошо знаком с последними, предпочтёт обычные функции, в силу привычки считая их понятнее, проще, удобнее.
            Читать дальше →
          • Кнопочное мышление против целостного IT-продукта

              Эта статья — выражение моей личной боли. Кнопочные решения портят мне жизнь, я трачу время на споры и обоснования.



              Когда мы общаемся с коллегами, заказчиками или пользователями, я использую фразу «кнопочное мышление». Что я имею ввиду под этим термином? Текущая статья — развернутый ответ на этот вопрос.



              Синонимами кнопочного мышления я считаю «экранное мышление» или преждевременную концептуализацию. Я раскрою мышление кнопками на десятке примеров из практики. А здесь для начала история, которая наверняка случалась с каждым. Представьте к вам приходят и рассказывают о падении конверсии на сайте. А вы ему сразу: «Давайте кнопку покупки сделаем побольше и поярче!». Что произошло? В бизнесе возникла проблема. Вместо погружения в детали, вместо исследования причин, вы играете с размерами кнопки. Вот в таких случаях я говорю о кнопочном мышлении.



              Для тех, кто любит смотреть, а не читать, есть видео и слайды.


              Читать дальше →
            • Горизонтальное масштабирование. Что, зачем, когда и как?

                Александр Макаров

                Александр Макаров ( SamDark )


                Здравствуйте! Я Александр Макаров, и вы можете меня знать по фреймворку «Yii» — я один из его разработчиков. У меня также есть full-time работа — и это уже не стартап — Stay.com, который занимается путешествиями.

                Сегодня я буду рассказывать про горизонтальное масштабирование, но в очень-очень общих словах.

                Что такое масштабирование, вообще? Это возможность увеличить производительность проекта за минимальное время путем добавления ресурсов.

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

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


                Текстовая расшифровка | Презентация

                Следующий урок выйдет уже завтра. В нем пойдет речь об участниках рынка арбитража. Расписание выхода всех уроков доступно на сайте Mobio School. Задавать любые вопросы по арбитражу можно в комментариях или в нашей группе ВКонтакте.
                Текстом
                • +10
                • 147k
                • 5
              • Двенадцать полезных Chrome DevTools Tips

                • Translation
                В данной статье мы рассмотрим некоторые функции инструментов разработчика Chrome. Конкретно я использую Chrome Canary и вам советую. И не потому, что это отсылка на маленьких милых птиц, которые пожертвовали своими жизнями чтобы мы могли добывать свежий уголь.

                Некоторые из DevTools функций вы возможно не знали. Я буду очень счастлив, если хотя бы одну из них вы найдете для себя полезной.

                (В статье ниже присутствуют анимированные гифги, которые начинают раздражать после первого цикла. Поэтому я советую открыть dev tools и удалить DOM ноды, которые отвечают за изображения.)

                Итак, поехали:

                Копируем переменную в буфер обмена


                Об этой возможности я узнал из комментариев, и считаю ее достаточно полезной чтобы быть описанной в начале. Иногда бывает нужно скопировать содержимое переменной в буфер обмена. Например html код или json объект. Для этого можно использовать copy функцию.

                copy (someVariable)

                Теперь текстовое представление переменной скопировано в буфер обмена.
                Читать дальше →
              • Hermitage — решение ваших проблем с хранением и обработкой изображений

                Всем привет! Буду краток: в обмен на пять минут вашего времени отдел PHP-разработки компании Лайв Тайпинг расскажет вам о собственном микросервисе для хранения и обработки загружаемых изображений. Он называется Hermitage. Его задача — представлять изображение в разных версиях согласно заранее заданным параметрам. Hermitage будет полезен в ситуациях, когда необходим автономный и масштабируемый сервер для хранения изображений и манипуляций над ними.
                hermitage
                Читать дальше →
              • «Ни единого разрыва»: чего стоит сделать онлайн-трансляцию, которая не будет падать, тормозить и вызывать боль в глазах?

                  Если кто следит за нашим блогом, наверняка уже знает, что мы проводим хардкорные технические конференции в разных областях программирования (Java, .NET, HolyJS, iOS/Android, тестирование). Конференции эти традиционно проходят в Москве и Петербурге, почему? Потому что в этих городах физически больше разработчиков – это позволяет собирать под одной крышей по 500-1000 единомышленников.



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

                  Как выглядит идеальная на наш взгляд трансляция? Вот несколько ссылок на свежие трансляции последних конференций:
















                  А если вам интересно, чего нам стоило отточить трансляцию и видеозаписи до такого состояния, а также какие факапы с реал-тайм системой вызывают самый сильный баттхерт, читайте под катом.
                  Читать дальше →
                • Руководство по проектированию реляционных баз данных (1-3 часть из 15) [перевод]

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

                  Другие части: 4-6, 7-9, 10-13, 14-15.

                  Руководство по проектированию баз данных.



                  1. Вступление.

                  Если вы собираетесь создавать собственные базы данных, то неплохо было бы придерживаться правил проектирования баз данных, так как это обеспечит долговременную целостность и простоту обслуживания ваших данных. Данное руководство расскажет вам что представляют из себя базы данных и как спроектировать базу данных, которая подчиняется правилам проектирования реляционных баз данных.
                  Читать дальше →
                • Чем полезен мономорфизм?

                  • Translation


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

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

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

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

                    Зимой 2016 года у нас в Stepic.org возникла идея сделать для наших учащихся персонального помощника, поэтому мы позвали студента СПбАУ РАН Константина Чаркина на стажировку, результатом которой видели Telegram-бота. Это потом всё вышло из под контроля и появился набор стикеров и каналы по курсам… Но обо всём по порядку!


                    Читать дальше →
                    • +13
                    • 23.5k
                    • 5
                  • Руководство по работе с Redux

                    • Translation
                    • Tutorial
                    Сегодня Redux — это одно из наиболее интересных явлений мира JavaScript. Он выделяется из сотни библиотек и фреймворков тем, что грамотно решает множество разных вопросов путем введения простой и предсказуемой модели состояний, уклоне на функциональное программирование и неизменяемые данные, предоставления компактного API. Что ещё нужно для счастья? Redux — библиотека очень маленькая, и выучить её API не сложно. Но у многих людей происходит своеобразный разрыв шаблона — небольшое количество компонентов и добровольные ограничения чистых функций и неизменяемых данных могут показаться неоправданным принуждением. Каким именно образом работать в таких условиях?

                    В этом руководстве мы рассмотрим создание с нуля full-stack приложения с использованием Redux и Immutable-js. Применив подход TDD, пройдём все этапы конструирования Node+Redux бэкенда и React+Redux фронтенда приложения. Помимо этого мы будем использовать такие инструменты, как ES6, Babel, Socket.io, Webpack и Mocha. Набор весьма любопытный, и вы мигом его освоите!
                    Читать дальше →
                  • Асинхронность в JavaScript: Пособие для тех, кто хочет разобраться

                      image


                      На JavaScript легко писать. Достаточно взять пару библиотек или модный фреймворк, прочитать несложный туториал и все — через пару часов у вас простой работающий интерфейс.


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

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