Обновить
256K+

JavaScript *

Прототипно-ориентированный язык программирования

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

Тащим музыку из ВК без публичного music API

Время на прочтение6 мин
Охват и читатели92K

Как все начиналось


Дело было вечером, делать было нечего… Точнее, я просто хотел загрузить аудиокнигу перед парами и тут меня ждал сюрприз. Кэш в кейт мобайле отключили. Как так? Что делать? Конечно же писать свое приложение с кэшем и аудиозаписями. Но для начала нужно понять, как вк превращает ссылки вида audio%user_id%_%track_id% в прямые ссылки на mp3. Что из этого вышло приложения я не написал и как скачать определенный плейлист можно прочитать под катом.
Читать дальше →

Окружение для разработки веб-приложений на TypeScript и React: от 'hello world' до современного SPA. Часть 1

Время на прочтение14 мин
Охват и читатели42K
Цель данной статьи — вместе с читателем написать окружение для разработки современных веб-приложений, последовательно добавляя и настраивая необходимые инструменты и библиотеки. По аналогии с многочисленными starter-kit / boilerplate репозиториями, но наш, собственный.

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

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

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

Первая демонстрация TypeScript

Время на прочтение10 мин
Охват и читатели16K
Совсем недавно состоялась пятая годовщина TypeScript, и у меня появилась возможность увидеться с Андерсом и командой разработчиков на еженедельном техническом совещании. Мне хотелось поздравить их с важной вехой в жизни TypeScript, сказать им о том, как много они сделали за те четыре года, которые прошли с даты моего ухода из проекта.



Кроме того, я разыскал некоторые старые демки, сделанные на TypeScript в самом начале работы над проектом (тогда он назывался Strada), для того, чтобы посмотреть их вместе с теми, кто работает над TypeScript сейчас.

Сегодня я хочу рассказать о том, с чего начинался TypeScript.
Читать дальше →

Как мы заставили npm-пакеты работать в браузере

Время на прочтение9 мин
Охват и читатели15K


В ходе начальной разработки проекта CodeSandbox я всегда игнорировал поддержку npm-зависимостей. Я думал, что невозможно установить в браузер произвольное, случайное количество пакетов, мой мозг просто отказывался об этом думать.


Сегодня поддержка npm — одна из определяющих возможностей CodeSandbox, так что как-то нам удалось это реализовать. Чтобы фича работала при любых сценариях, пришлось сделать немало итераций, много раз переписывая код, и даже сегодня мы всё ещё можем улучшить логику. Я расскажу, с чего у нас начиналась поддержка npm, что имеем сегодня и что можем сделать для её улучшения.

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

Как работает JS: цикл событий, асинхронность и пять способов улучшения кода с помощью async / await

Время на прочтение21 мин
Охват и читатели198K
[Советуем почитать] Другие 19 частей цикла
Часть 1: Обзор движка, механизмов времени выполнения, стека вызовов
Часть 2: О внутреннем устройстве V8 и оптимизации кода
Часть 3: Управление памятью, четыре вида утечек памяти и борьба с ними
Часть 4: Цикл событий, асинхронность и пять способов улучшения кода с помощью async / await
Часть 5: WebSocket и HTTP/2+SSE. Что выбрать?
Часть 6: Особенности и сфера применения WebAssembly
Часть 7: Веб-воркеры и пять сценариев их использования
Часть 8: Сервис-воркеры
Часть 9: Веб push-уведомления
Часть 10: Отслеживание изменений в DOM с помощью MutationObserver
Часть 11: Движки рендеринга веб-страниц и советы по оптимизации их производительности
Часть 12: Сетевая подсистема браузеров, оптимизация её производительности и безопасности
Часть 12: Сетевая подсистема браузеров, оптимизация её производительности и безопасности
Часть 13: Анимация средствами CSS и JavaScript
Часть 14: Как работает JS: абстрактные синтаксические деревья, парсинг и его оптимизация
Часть 15: Как работает JS: классы и наследование, транспиляция в Babel и TypeScript
Часть 16: Как работает JS: системы хранения данных
Часть 17: Как работает JS: технология Shadow DOM и веб-компоненты
Часть 18: Как работает JS: WebRTC и механизмы P2P-коммуникаций
Часть 19: Как работает JS: пользовательские элементы

Перед вами четвёртая часть серии материалов, посвящённых внутренним особенностям работы JavaScript. Эти материалы, с одной стороны, направлены на изучение базовых элементов языка и экосистемы JS, с другой, содержат рекомендации, основанные на практике разработки ПО в компании SessionStack. Конкурентоспособное JS-приложение должно быть быстрым и надёжным. Создание таких приложений — та цель, к которой, в конечном счёте, стремится любой, интересующийся механизмами JavaScript.

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

JavaScript ES8 и переход на async / await

Время на прочтение8 мин
Охват и читатели59K
Недавно мы опубликовали материал «Промисы в ES6: паттерны и анти-паттерны». Он вызвал серьёзный интерес аудитории, в комментариях к нему наши читатели рассуждали об особенностях написания асинхронного кода в современных JS-проектах. Кстати, советуем почитать их комментарии — найдёте там много интересного.

image

По совету пользователя ilnuribat мы добавили к материалу опрос, целью которого было выяснить популярность промисов, коллбэков и конструкций async / await. По состоянию на 9-е сентября промисы и async / await получили примерно по 43% голосов, с небольшим перевесом async / await, коллбэкам досталось 14%. Главный вывод, который можно сделать, проанализировав результаты опроса и комментарии, заключается в том, что важны все имеющиеся технологии, однако, всё больше программистов тяготеют к async / await. Поэтому сегодня мы решили опубликовать перевод статьи про переход на async / await, которая является продолжением материала о промисах.
Читать дальше →

INTERCOM'17. Конференция о коммуникациях для бизнеса

Время на прочтение2 мин
Охват и читатели2.4K

Раз в год мы устраиваем в Москве конференцию INTERCOM, чтобы пообщаться с коллегами и обсудить, что нового в области автоматики коммуникаций. В этом году мы помогали заменять роботами колл-центры, нанимать сотрудников, связывать докторов с пациентами, вызывать такси, доставлять посылки и много чего еще, о технической стороне вопросов часто рассказывали на Хабре. А на конференции мы это все обсудим с коллегами из Яндекс, Atlassian, Битрикс24 и других компаний. Нейросети, погоня по мессенджерам, гадание на кофейных бизнес-процессах, карманные сети сотовой связи и много всего интересного, о чем я немного расскажу под катом. Еще под катом у меня телефонный робот-ящер, у которого можно нечестным образом получить бесплатный билет и другие фишки для Хабрапользователей. Так что если вопрос «кто виноват в том, что мне позвонил робот» вас интересует — присоединяйтесь!

Кто будет?

FrontFest.Mix — 7 тем о кодстайле, WebGL, A/B, RON, шаблонизации, экосистеме JavaScript и жизни программиста

Время на прочтение2 мин
Охват и читатели4.7K


Можно не знать о модных технологиях, не думать о доступности сайтов, забивать на развитие экосистемы, но, кажется, через год-другой с таким подходом можно стать таксистом-программистом. Нам эта история не близка, поэтому на конференции FrontFest, кроме понятных всем потоков VYORSTKA и JS, мы заложили в программу поток MIX. Как ясно из названия, он для докладов, которые не вписываются в первые два потока — это выступления о кодстайле, производительности фронтенда, форматах данных, экосистеме JavaScript и развитии фронтендера как разработчика.
Почему это важно?

Node.js и переход с PHP на JavaScript

Время на прочтение9 мин
Охват и читатели62K
Больше десяти лет я был PHP-разработчиком, но недавно перешёл на JavaScript, используя его серверные и клиентские возможности. До этого я уже был знаком с JS. Сначала работал с jQuery, потом освоил Angular, и, наконец, начал пользоваться React.

Когда я начинал писать на PHP, я встраивал его в HTML-файлы. Получался не код, а полный бардак. Поэтому, для того, чтобы привести мои разработки в приличный вид, я начал пользоваться фреймворками, в частности, ZF1 и ZF2. Через некоторое время подход, при использовании которого начинают разработку с API, привёл к тому, что у меня оказался сервер, состоящий из сгенерированных REST API и из нескольких сотен строк моего собственного кода.



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

Сегодня я расскажу, в основном, о своём путешествии с серверной стороны PHP на серверную сторону JS в виде Node.js. Здесь я не буду рассказывать о Webpack, React и о других клиентских технологиях JS.
Читать дальше →

Новшества серверного рендеринга в React 16

Время на прочтение11 мин
Охват и читатели47K
Вышел React 16! Рассказывая об этом событии, можно упомянуть множество замечательных новостей (вроде архитектуры ядра Fibers), но лично меня больше всего восхищают улучшения серверного рендеринга. Предлагаю подробно всё это разобрать и сравнить с тем, что было раньше. Надеюсь, серверный рендеринг в React 16 понравится вам так же, как он понравился мне.


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

Как сделать веб-приложение для вашего собственного Bluetooth Low Energy девайса?

Время на прочтение19 мин
Охват и читатели54K
Несколько недель назад я, развлечения ради, собрал простенькую роботизированную руку (а-ля манипулятор) и решил прикрутить к ней управление со смартфона через Bluetooth. Опыта в разработке нативных мобильных приложений у меня пока нет, с Apache Cordova я уже знаком, а вот задействовать Web Bluetooth API было бы интересно, приправив фишками Progressive Web Apps.

Картинка Для Привлечения Внимания
Картинка Для Привлечения Внимания, ведущая под кат


На первый взгляд может показаться, что статей по ключевым словам достаточно: есть спецификация Web Bluetooth, подробная статья в блоге Google Developers с примерами, есть подробный разбор Bluetooth Low Energy, примеры реверс-инжиниринга протоколов различных BLE устройств и даже моргания «умными» лампочками и получения данных от фитнес-браслетов прямо из браузера — что может пойти не так?
Читать дальше →

Что последует за вебом?

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

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

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

Дайджест свежих материалов из мира фронтенда за последнюю неделю №282 (25 сентября — 1 октября 2017)

Время на прочтение4 мин
Охват и читатели17K
Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.


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

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

V8 под капотом

Время на прочтение14 мин
Охват и читатели34K
Ведущий разработчик Яндекс.Деньги Андрей Мелихов (также редактор/переводчик сообщества devSchacht) на примере движка V8 рассказывает о том, как и через какие стадии проходит программа, прежде чем превращается в машинный код, и зачем на самом деле нужен новый компилятор.



Материал подготовлен на основе доклада автора на конференции HolyJS 2017, которая проходила в Санкт-Петербурге 2-3 июня. Презентацию в pdf можно найти по этой ссылке.
Читать дальше →

Переводим интерфейсы на полсотни языков. Sketch

Время на прочтение7 мин
Охват и читатели11K


Герои сериала «Шерлок»


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


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

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

Пора убить веб

Время на прочтение11 мин
Охват и читатели77K
Что-то происходит. Люди недовольны. Призрак гражданских беспорядков преследует наши программистские сообщества.

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


Это ты, хакер фронтенда
Читать дальше →

Числа — доклад Дугласа Крокфорда о системах счисления в жизни и в программировании

Время на прочтение20 мин
Охват и читатели15K
Сейчас компьютеры решают почти любые задачи. Они работают и приносят выгоду практически во всех отраслях. Но давайте посмотрим, что такое компьютер. Это машина, которая манипулирует числами. Подобные манипуляции — практически все, что они могут делать. Поэтому тот факт, что они решают так много задач, просто манипулируя числами, кажется почти волшебным.

Давайте посмотрим, откуда пришли числа, куда они могут привести и как они работают.



В основе статьи — доклад Дугласа Крокфорда (Douglas Crockford) с июньской конференции HolyJS 2017 в Санкт-Петербурге (презентацию доклада можно найти тут)

Библиотека быстрого поиска путей на графе

Время на прочтение8 мин
Охват и читатели36K

Привет, Друзья!


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


Пример использования на огромном графе:



Поиграться с демо можно здесь


В библиотеке используется мало-известный вариант A* поиска, который называется NBA*. Это двунаправленный поиск, с расслабленными требованиями к функции-эвристике, и очень агрессивным критерием завершения. Не смотря на свою малоизвестность у алгоритма отличная скорость сходимости к оптимальному решению.


Описание разных вариантов A* уже не раз встречалось на хабре. Мне очень понравилось вот это, потому повторяться в этой статье я не буду. Под катом расскажу подробнее почему библиотека работает быстро и о том, как было сделано демо.

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

Скрытый JS-майнинг криптовалюты на сайте: альтернатива рекламе или новая чума

Время на прочтение4 мин
Охват и читатели149K

image
Буквально недавно промелькнула новость про Pirate Bay, который начал тестировать криптомайнер на JavaScript как альтернативу традиционной рекламной модели. Теперь же, судя по всему, нас ждет волна интеграции подобных скриптов в каждый мелкий магазинчик по продаже швейных принадлежностей. Только сегодня наткнулся на аналогичный скрипт, встроенный в код сайта zveruga.net — небольшой сети по продаже товаров для животных.

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

Safari 11 и WebRTC: подводные камни видеозвонков

Время на прочтение2 мин
Охват и читатели9.9K
Итак, это свершилось. Кроме iPhone 8, который устарел ровно через полчаса после анонса iPhone 10, Apple обновила свой десктопный и мобильный браузер Safari. Среди прочих улучшений — реализация WebRTC (ходят слухи, что частично позаимствованная у Chromium. «Plan B» на это тоже намекает). Что это значит для разработчиков? Можно звонить через браузер как на десктопе, так и на айфонах. Голосом и видео. Я уже писал про обновленные инструменты разработчика в браузере, а сейчас хочу поделиться, как это все работает в релизе. Мы уже обновили SDK Voximplant, проверили, как Safari звонит в Microsoft Edge, и вот что я хочу рассказать…