JavaScript *

Последние три года я занимаюсь разработкой серверов на Node.js и в процессе работы у меня накопилась некоторая кодовая база, которую я решил оформить в виде фреймворка и выложил в open-source.

Основными особенностями фреймворка можно назвать:

• простую архитектуру, без всякой JS – магии
• автоматическую сериализацию/десериализацию моделей (например, не нужно проверять пришло ли поле с клиента, все проверяется автоматически)
• возможность генерации схемы API
• генерацию документации на основе схемы
• генерацию полностью типизированного SDK для клиента (на данный момент речь про JS frontend)

В данной статье мы поговорим немного о Node.js и рассмотрим данный фреймворк

Всем кому интересно – прошу под кат

Публикуем перевод седьмой части часть серии материалов об особенностях работы различных механизмов JavaScript. Наша сегодняшняя тема — веб-воркеры. В частности, речь пойдёт о различных типах веб-воркеров, о том, как организована совместная работа тех частей, из которых они состоят, а также об их возможностях и об ограничениях, с которыми можно столкнуться в разных сценариях их использования. Здесь же будет показано 5 вариантов практического применения веб-воркеров.

В январе мы в Skyeng закончили перевод нашей платформы Vimbox с AngularJS на Angular 4. За время подготовки и перехода у нас накопилось много записей, посвященных планированию, решению возникающих проблем и новым конвенциям работы, и мы решили поделиться ими в трех статьях на Хабре. Надеемся, что наши заметки окажутся полезными структурно похожим на наш Vimbox проектам, которые только начали переезжать или собираются сделать это.

Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.

Если вам знакома ситуация, когда нужно обработать заявку от клиента размером 150 или больше позиций, подобрав для каждой самую лучшую по цене из 20 прайс-листов по 10 000 + позиций в каждом, но вы не готовы тратить на это больше 30 минут, то добро пожаловать под кат.

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

Тот пост вызвал живой и эмоциональный отклик аудитории. Кто-то говорил о том, что всё пропало, и теперь он не сможет спокойно спать, кто-то утверждал, что уж его-то проектов это точно не коснётся, кто-то задавал вопросы о том, как от такого защититься… К проблеме, поднятой в предыдущем материале, можно относиться по-разному, но она вполне реальна, поэтому сегодня мы публикуем продолжение истории того, кто ворует номера кредиток. Сегодня он расскажет о методах защиты веб-проектов от потенциально опасного кода.

Всем привет! На этот раз на повестке дня перевод статьи Valentino Gagliardi «Webpack 4 tutorial: All You Need to Know, from 0 Conf to Production Mode».



Команда разработчиков Webpack этот раз изрядно потрудилась над новым поколением популярного сборщика модулей (бандлера) — webpack 4.

Репозиторий с используемым кодом здесь.

Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.

Недавно по Твиттеру и Реддиту гулял интересный кусок кода на JavaScript. Вопрос, связанный с ним, заключался в следующем: «Может ли выражение (a==1 && a==2 && a==3) вернуть true?». Ответ на вопрос, как ни странно, был положительным.



Сегодня мы разберём этот код и постараемся его понять.

22 декабря 2017 года — ВКонтакте выкатила интересный апгрейд собственного iOS-приложения. Вот цитата новостного агентства, касающаяся конкретных изменений:

В новой версии «ВКонтакте» для iOS и Android появилась поддержка Accelerated Mobile Pages (AMP) — мобильного стандарта, который позволяет быстро загружать внешние статьи. Теперь страницы всех сайтов, которые настроили AMP, открываются прямо внутри приложения.

(официальная новость)

Технология AMP, разработку которой инициировал Google, призвана ускорять работу вебсайтов на всех устройствах и платформах. Это современный подход к оптимизации HTML и CSS, позволяющий ускорять загрузку на устройствах с помощью preconnect API и асинхронного выполнения Javascript.

Эта статья возникла из-за одной моей ошибки и двух багов — по одному в Chromium Headless и ChromeDriver. В результате пришлось собрать всё это из исходников (в статье есть подробнейшая инструкция), отладить цепочку взаимодействия Selenium<->ChromeDriver<->Chromium в отладчике IntelliJ IDEA и Microsoft Visual Studio, покопаться в Java, C++ и JS.

Статья будет интересна тем, кто хочет понять, чем им грозит переход на Selenium + Headless Chrome и как с этим жить. А также всем, кто просто хочет немного поглумиться над несчастным быдлокодером.

Под катом есть пачка скриншотов (трафик!).

Кстати, всё это можно было бы сделать скринкастом — но нельзя, потому что время компиляции C++ необычайно долгое. Вместо этого тут будут скриншоты для привлечения внимания.

Вначале напомню названия участвующих продуктов. Их три штуки:

• Chromium — это браузер. Небрендированная версия Google Chrome, без автообновлений, анальных следящих зондов, но и без несвободных компонентов типа кодеков.
• Chromium ChromeDriver — это часть Chromium, которая отвечает за управление им с помощью внешних инструментов. Это standalone фронт-сервер (отдельный exe-файл), реализует стандарт W3C WebDriver и использует в качестве бэкенда Chrome DevTools.
• Selenium и его Selenium Chrome Driver — эта штука предоставляет Java API для управления Хромиумом. Джава тут не принципиальна, на JavaScript и jWebDriver было бы то же самое (а на Puppeteer — возможно, нет, ибо он использует DevTools напрямую).

Всё вместе даёт нам в руки браузер, управляемый с помощью API на Java, JavaScript и так далее.

Вспомнили? Поехали дальше.

Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.

Оба авторе: Лин Кларк — разработчик в группе Mozilla Developer Relations. Занимается JavaScript, WebAssembly, Rust и Servo, а также рисует комиксы о коде.

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

Одна из техник — потоковая компиляция, когда браузер компилирует код во время его загрузки. До настоящего времени эта технология рассматривалась лишь как потенциальный вариант ускорения. Но с выпуском Firefox 58 она станет реальностью.

Firefox 58 также включает в себя двухуровневый компилятор. Новый базовый компилятор компилирует код в 10–15 раз быстрее, чем оптимизирующий компилятор.

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



На десктопе мы компилируем 30-60 МБ кода WebAssembly в секунду. Это быстрее, чем сеть доставляет пакеты.

В онлайн-трансляции нашей конференции HolyJS мы подходили к стендам спонсоров и расспрашивали их о JavaScript-разработке. На стенде Solar Security Андрей gritsev Грицевич (руководитель разработки решения Solar Dozor) рассказал нам про используемый фреймворк Ext JS — и мы подумали, что его слова могут быть интересны не только зрителям трансляции, но и читателям Хабра, не работавшим с этим фреймворком. Поэтому расшифровали этот диалог и, немного отредактировав, публикуем здесь.

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

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

Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.

Hermione — опенсорс-инструмент для автоматизации интеграционного тестирования. На конференции FrontTalks разработчик службы поисковых интерфейсов Николай Ильченко tavriaforever объяснил, почему наши интерфейсы всё ещё иногда ломаются, в чём плюсы Гермионы, и показал, как начать ей пользоваться.


— Я приехал с докладом про Гермиону. Но это не про Гарри Поттера, и это совсем не сказки.

На днях я читал материалы на MDN и наткнулся на некоторые довольно интересные возможности и API JavaScript, о существовании которых я не знал. Хочу сегодня о них рассказать.

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

Предисловие от переводчика

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

Продолжение: Рассказ о том, как не дать мне украсть номера кредиток и пароли у посетителей ваших сайтов

Представляем вам перевод статьи человека, который несколько лет воровал имена пользователей, пароли и номера кредитных карт с различных сайтов.

То, о чём я хочу рассказать, было на самом деле. Или, может быть, моя история лишь основана на реальных событиях. А возможно всё это — выдумка.

Выдалась однажды такая неделя — безумное время, когда всех вокруг тревожила безопасность. Ощущение было такое, что новые уязвимости появляются ежедневно. Мне было не так уж и просто делать вид, будто я понимаю, что происходит, когда меня об этом спрашивали близкие люди. Их беспокоила перспектива того, что их взломают, что их данные утекут неизвестно куда. Всё это заставило меня на многое взглянуть по-новому.

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