• Конкурентность: Асинхронность

      Мы всё-таки смогли дойти до третьей части и добрались до самого интересного — организации асинхронных вычислений.


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


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


      Читать дальше →
    • Справочник по антеннам для радаров

      • Translation
      Статья на перевод предложена alessandro893. Материал взят с обширного справочного сайта, описывающего, в частности, принципы работы и устройство радаров.

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

      image
      Слева – изотропная антенна, справа – направленная

      Дипольная антенна





      over9000 картинок
    • JavaScript-тренды, на которые стоит обратить внимание в 2017-м

      • Translation
      image

      Я решил написать этот материал после того, как увидел твит Дэна Абрамова, за который хочу сказать ему огромное спасибо. Дэн задал своим подписчикам вопрос о самых интересных событиях в мире JavaScript, которые достойны внимания широкой общественности.


      Любители JS на вопрос откликнулись, под твитом собралась целая гора ответов. Каждый говорил о том, на что, по его мнению, стоит обратить внимание в 2017-м году. В результате получилась весьма занимательная подборка, из которой я выбрал всё лучшее и добавил пояснения.
      Читать дальше →
    • Разделяй и властвуй — float, position и display

        Поговорим о всем известном свойстве float, не менее известном position и их соседе — display.

        Как известно, в css есть понятие «схема позиционирования». Этих схем позиционирования есть три вида — нормальный поток, поплавки и абсолютное позиционирование.

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

        термины и продолжение
      • Как вы можете использовать отзывчивые веб-компоненты сегодня

        • Translation
        • Tutorial

        Пару лет назад я впервые услышал про веб-компоненты (Web Components). Сперва меня это действительно заинтересовало, но как только шумиха вокруг них приутихла, они тут же вылетели у меня из головы. Но, как оказалось, в последнее время прошло интересное движение и поддержка этой технологии значительно выросла. Отзывчивые веб-компоненты, в частности, призваны упростить наш подход к адаптивному дизайну. Как многообещающе звучит!
        Вот четыре пункта, с которыми стоит ознакомиться любому разработчику перед началом использования данной технологии:
        • Поддержка технологии;
        • Кроссбраузерная работа;
        • Возможность адаптации в среде удельного проекта;
        • Модульный подход.

        В этой статье мы рассмотрим каждый из этих пунктов в отдельности…
        Читать дальше →
      • Важные аспекты работы браузера для разработчиков. Часть 1

        • Tutorial

        Автор: Антон Реймер

        Статья основана на вебинаре, который я проводил некоторое время назад. Рассчитана она, в первую очередь на тех, кто не знает, как работают браузеры, или тех, у кого есть пробелы в знаниях. Вероятно, здесь будет много очевидного для тех кто не первый день в веб-разработке. Статью я решил разделить на две части. В первой рассмотрим общие принципы работы браузера. Во второй части я акцентирую внимание на некоторых важных моментах: reflow и repaint, event loop.

        Что такое браузер?


        Браузер — программа, работающая в операционной системе. Большинство браузеров написано на языке C++. Основное предназначение браузера — воспроизводить контент с веб-ресурсов. В качестве веб-ресурса в большинстве случаев выступает html-страница. Это также может быть pdf-файл, png, jpeg, xml-файлы и другие типы. Среди огромного количества браузеров можно выделить самые популярные: Chrome, Safari, Firefox, Opera и Internet Explorer. Мы рассмотрим браузеры с открытым исходным кодом: Chrome, Firefox, Safari.

        Из чего состоит и как работает браузер?



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

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

        image

        Примечание: этот материал представляет собой свободный перевод статьи Джереми Томаса о том, как просто работать с Flexbox на примере верстки шаблона новостного сайта.

        Поверьте, нет никакой необходимости в детальном разборе всех аспектов работы с Flexbox, если вы хотите начать им пользоваться уже сейчас. В этом руководстве автор собирается познакомить вас с некоторыми свойствами Flexbox и сделать «новостной лейаут» наподобие того, который вы могли видеть на сайте The Guardian.
        Читать дальше →
      • Верстка адаптивных электронных писем: Проблемы и их решения

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

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



          Фото Johan Larsson / Flickr / CC
          Читать дальше →
        • Верстка интернет-магазина: список товаров



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


            Некоторые приемы уже были рассмотрены в различных статьях. Однако у меня возникло желание объединить их и проиллюстрировать отдельными демо. Надеюсь, в таком виде наработки окажутся полезны верстальщикам, которым часто приходится работать над интернет-магазинами.

            Читать дальше →
          • React.js: собираем с нуля изоморфное / универсальное приложение. Часть 1: собираем стек

            image

            Лицо моей жены, когда она вычитывала эту статью


            Я решил написать цикл статей, который и сам был бы счастлив найти где-то полгода назад. Он будет интересен в первую очередь тем, кто хотел бы начать разрабатывать классные приложения на React.js, но не знает, как подступиться к зоопарку разных технологий и инструментов, которые необходимо знать для полноценной front-end разработки в наши дни.


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

            Читать дальше →
          • Очередной метод снизить объем SPA приложения (webpack)

              Так уж случилось, что в последнее время мне приходится осваивать новые инструменты. Очередным таким инструментом стал webpack. Инструмент интересный, но после переезда с Google Closure * для меня стало загадкой, почему webpack не ужимает имена классов, как это делает Google Closure Stylesheets. За день, на коленке, мною был написан plugin который вполне не плохо реализовал этот функционал. Более подробное описание ниже.
              Читать дальше →
            • Рефакторинг салона видеопроката на JavaScript

              • Translation
              Моя книга по рефакторингу в 1999 году начиналась с простого примера расчёта и форматирования чека для видеомагазина. На современном JavaScript есть несколько вариантов рефакторинга того кода. Здесь я изложу четыре из них: рефакторинг функций верхнего уровня; переход к вложенной функции с диспетчером; используя классы; трансформация с применением промежуточной структуры данных.

              Много лет назад, когда я писал книгу по рефакторингу, я начал с (очень) простого примера рефакторинга кода, который вычислял счёт для клиента за прокат видеофильмов (в те дни нам нужно было ходить в салон для этого). Недавно я размышлял об этом примере, в частности, как бы он выглядел на современном JavaScript.

              Любой рефакторинг подразумевает улучшение кода в определённом направлении, в том, которое соответствует стилю программирования команды разработчиков. Пример в книге был на Java, а Java (именно в то время) подразумевала определённый стиль программирования, объектно-ориентированный стиль. Однако с JavaScript есть гораздо больше вариантов, какой стиль выбрать. Хотя вы можете придерживаться Java-подобного объектно-ориентированного стиля, особенно с ES6 (Ecmascript 2015), не все сторонники JavaScript одобряют этот стиль. Многие действительно считают, что использовать классы Очень Плохо.
              Читать дальше →
            • Async/await это шаг назад для JavaScript'a?

              • Translation


              В конце 2015 года я услышал об этой паре ключевых слов, которые ворвались в мир JavaScript, чтобы спасти нас от promise chain hell, который, в свою очередь, должен был спасти нас от callback hell. Давайте посмотрим несколько примеров, чтобы понять, как мы дошли до async/await.
              Читать дальше →
            • Чистый javascript.Тестирование. Форматирование. Комментарии

              • Translation
              Предлагаю читателям «Хабрахабра» перевод книги Райана Макдермота «Clean-code-javascript».

              Оглавление



              Читать дальше →
              • +14
              • 13.6k
              • 5
            • Карточная игра на JavaScript и Canvas, или персональный Лас-Вегас. Часть 1

                Однажды на досуге я придумал карточную игру и, недолго думая, создал ее электронную версию. А потом добавил еще четыре игры, включая покер Техасский Холдем. А чтобы было еще интереснее, я встроил некое подобие прогресса: выигрываешь в одной игре – открывается новая. Запланировал я разместить свою игру в двух социальных сетях и в магазине Windows Store как html5-js приложение. А также, возможно, создать еще сборки под Android и iOs. Можно играть чрез сервер с другими людьми, а можно – офф-лайн с ИИ.

                Для работы я, как всегда, не использовал никакие сторонние движки и библиотеки, даже jQuery мне не понадобилось. Только функции ванильного JavaScript, включая средства работы с холстом (canvas). Холст в игре – основа для вывода всей игровой графики. В WebGL, на этот раз, не было необходимости, поэтому зоопарк поддерживаемых браузеров расширился. Средой программирования, как обычно, стал продвинутый блокнот. Игра получилась объемом 3,8 Мб, из которых 3 Мб — это семь карт спрайтов в формате png. Запускается игра по html-файлу. Сервер на PHP. В случае выбора однопользовательской игры (то есть, с ИИ), запросы к серверу не отправляются и все расчеты ведутся на клиенте. Диздок не писал – он не нужен хипстерам.


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

                • Translation
                Примечание: первоначально эта статья была написана для сайта Fuel Your Coding back в мае 2010 года. К сожалению, этот сайт сейчас не работает, поэтому я публикую статью здесь, чтобы сохранить её для потомков. Я собирался обновить её, учитывая последние веяния, но решил оставить так, как она была написана. Те части, что подустарели, могут показаться немного смешными, но да ладно. Получайте удовольствие…

                Наиболее очевидным способом повысить качество своего программирования является писать больше программ. Каждый знает это. Однако другой способ, который, я уверен, улучшит ваше программирование, — совершенно противоположный. Изложу это так ясно, как смогу.

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

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

                В этой статье я хотел бы помочь вам в выборе того, что именно читать, и дать практические советы по такому чтению. Если вы уже и так читаете другие программы, то, может быть, вы найдёте здесь что-нибудь, что позволит получить больше от ваших усилий. Если же вы не читаете коды других разработчиков, то вы просто обязаны заняться этим.
                Читать дальше →
              • Так ли хорош React Native?

                  React Native React Native довольно новая технология которая с первого взгляда кажется серебряной пулей для многих начинающих разработчиков. В статье я хочу развеять этот миф и рассказать что же именно не так с React Native и почему стоит подождать прежде чем его использовать.

                  И так по порядку, я Full-stack разработчик. Использую последний стандарт javascript на фронетнде и бэкенде. Опыта разработки мобильных приложений нет, но есть 5 лет опыта разработки высоконагруженных проектов на node.js, asp.net mvc. Опробовать React Native я решил при создании простого мобильного приложения — клиента LessPass для Android.
                  Читать дальше →
                • Эволюция CSS: от CSS, SASS, BEM и CSS–модулей до styled-components

                  • Translation


                  С самого начала истории интернета мы нуждались в стилях для наших сайтов. Многие годы нам для этого служил CSS, развивавшийся в своём темпе. И здесь мы рассмотрим историю его развития.

                  Думаю, все согласятся с таким определением: CSS используется для описания представления документа, написанного на языке разметки. Также ни для кого не будет новостью, что за время развития CSS стал довольно мощным средством и что для использования в команде нужны дополнительные инструменты.
                  Читать дальше →
                • А ваша служба является RESTful? Все что необходимо/обязательно знать про веб службы и REST

                  Введение


                  Вот не люблю я изобретать велосипед и статью я бы эту не написал, но пришлось. Про REST сказано уже довольно много. Многие поставщики веб служб готовы клясться, что их службы являются RESTful. Во время собеседования вы точно услышите хотя бы несколько вопросов про REST, независимо от того это собеседования для бэкенд, мобайл или фронтенд разработчика. Я вот помню как-то во время одного собеседования меня задали такой вопрос: «Вот вы написали в своем резюме, что знайте REST․ Ответьте пожалуйста, какой HTTP код вы получите, если при запросе к RESTful сервису ресурс не найден?». Ответ 404 был принят единогласно. Если честно, я так и не понял, как этот вопрос помог понять знаю ли я REST или нет, но одно могу уверенно сказать: REST понимают далеко не все. Вот некоторые вопросы, которые мучали меня долгое время:

                  1. Зачем REST стал таким трендовым? Это архитектура была же предложена еще в 2000 году?
                  2. Что я получу если моя служба будет RESTful?
                  3. Как определить является ли служба RESTful или нет?
                  4. Как правильно должны создаваться URL REST служб?
                  5. Какие http методы и коды должны быть использованы в RESTful службе?

                  Если вы не можете дать исчерпывающего ответа хотя бы на один из этих вопросов, то продолжайте чтение. Если вы можете однозначно ответить на все эти вопросы, можете привести формат правильного URL, считайте, что GET, POST, PUT, DELETE обязательно должны соответствовать CRUD операциям с ресурсами, то вам обязательно надо продолжать чтение.
                  Читать дальше →