Обновить
256K+

JavaScript *

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

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

BigInt — длинная арифметика в JavaScript

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

BigInt — новый числовой примитивный тип данных в JavaScript, позволяющий работать с числами произвольной точности. С BigInt вы сможете безопасно хранить и обрабатывать большие целые числа даже за пределами максимального безопасного целочисленного значения Number. В этой статье мы рассмотрим некоторые примеры использования BigInt и новые функции Chrome 67, сравнивая BigInt и Number в JavaScript.

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

Как заставить Vue.js и Electron работать вместе

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


Введение


На волне популярности (надеюсь, что они популярны) Vue.js и Electron, возникает резонный вопрос, а как заставить их работать вместе. В этом небольшом руководстве я расскажу, как быстро установить и настроить шаблон для разработки приложений на Electron и Vue.js. И так приступим.


Что нам понадобится


  • yarn — пакетный менеджер, аналог npm. Я выбрал yarn, потому что мне просто нравится этот инструмент, однако вы можете использовать и npm. Как установить yarn здеся, а npm тута;
  • vue-cli — консольная утилита, которая позволяет быстро инициализировать проекты на Vue.js, добавив поддержку webpack;
  • electron-vue — шаблон, который мы и будем использовать.
Читать дальше →

Полезные приёмы работы с массивами в JavaScript

Время на прочтение6 мин
Охват и читатели54K
В большинстве приложений, которые разрабатываются в наши дни, требуется взаимодействовать с некими наборами данных. Обработка элементов в коллекциях — это часто встречающаяся операция, с который вы, наверняка, сталкивались. При работе, например, с массивами, можно, не задумываясь, пользоваться обычным циклом for, который выглядит примерно так: for (var i=0; i < value.length; i++ ){}. Однако, лучше, всё-таки, смотреть на вещи шире.

image

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

На самом деле, такие средства в JavaScript имеются. Некоторые из них рассмотрены в материале, перевод которого мы представляем сегодня вашему вниманию. В частности, речь идёт об операторе расширения, о цикле for…of, и о методах includes(), some(), every(), filter(), map() и reduce(). Здесь мы, в основном, будем говорить о массивах, но рассматриваемые здесь методики обычно подходят и для работы с объектами других типов.
Читать дальше →

Apollo graphql client — разработка приложений на react.js без redux

Время на прочтение4 мин
Охват и читатели65K
Apollo graphql client представляет удобный лаконичный спсоб работы с данными в приложениях react. В большинстве случаев все то, что мы привыкли делать с помощью redux, гораздо проще сделать при помощи Apollo graphql client. То, о чем я хотел бы рассказать в этой статье — это что связка react + apollo client + graphql существенно (на порядок) упрощает разработку приложений react.
Читать дальше →

UI-компоненты на пиксельных шейдерах: пишем ваш первый шейдер

Время на прочтение10 мин
Охват и читатели14K
Кого можно назвать «пиксельных шейдеров начальник и пикселов командир»? Дениса Радина, работающего в Evolution Gaming над фотореалистичными веб-играми с использованием React и WebGL: он известен многим как раз под именем Pixels Commander.

В декабре на нашей конференции HolyJS он выступил с докладом о том, как использование GLSL может улучшить работу с UI-компонентами по сравнению с «обычным джаваскриптом». А теперь для Хабра мы подготовили текстовую версию этого доклада — добро пожаловать под кат! Заодно прикладываем видеозапись выступления:


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

Поддержка технологии HTTP/2 Server Push в Node.js

Время на прочтение7 мин
Охват и читатели12K
В июле 2017 года в Node.js 8 появилась реализация HTTP/2. С тех пор она прошла через несколько этапов улучшений, и теперь в Node.js Foundation говорят о том, что они почти готовы к тому, чтобы вывести поддержку HTTP/2 из разряда экспериментальных возможностей. Если вы хотите испытать HTTP/2 в среде Node.js, лучше всего это сделать, воспользовавшись Node.js 9 — здесь имеются все самые свежие исправления ошибок и улучшения.
image
Материал, перевод которого мы сегодня публикуем, посвящён работе с HTTP/2, и, в частности, с Server Push, в Node.js.
Читать дальше →

Небольшое расследование: как YouTube использует WebRTC для стриминга

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

WebRTC — это JavaScript API в современных браузерах для видеозвонков. А еще для голосовых звонков, шаринга экрана, пробития NAT, раскрытия локального адреса и других интересных штук. В последние пару лет крупные игроки начинают переходить с пропиетарных API и расширений браузеров на WebRTC: с его помощью работает Skype for Web, частично — Hangouts, а теперь и возможности YouTube по броадкасту прямо из браузера. Пока только из хрома и с пятисекундной задержкой — но велика беда начало. Под катом мы предлагаем адаптированный для Хабра перевод детективной истории, где эксперты по WebRTC разбирают код клиентской части YouTube и рассказывают нам что и как сделали разработчики из Гугла.
Читать дальше →

Polymer 3.0 на Google I/O 2018

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

Всем привет!


В данный момент, как многие знают, проходит ежегодная конференция Google I/O, в рамках которой была представлена новая версия библиотеки для работы с интерфейсами веб-приложений Polymer 3.0 (видео на английском):


Как сделать конфигурационный файл роутов в React Router 4 (субтитры)

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

Когда react-router 4 только появился, многие переживали по двум поводам:


  • Как вынести роуты в отдельный файл (конфиг роутов)
  • Как теперь жить без onEnter хука.

В видео от Tyler McGinnis'a освещен первый вопрос.


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

Пятничный JS: случайное перемешивание

Время на прочтение6 мин
Охват и читатели53K
Экзамен в школе прапорщиков.
— Вот смотрите. Это большой палец, это — указательный, это — средний, это — безымянный, это — мизинец. Мешаем, мешаем, мешаем (двигает пальцами)… Теперь где какой?
Всем привет. С ортодоксальной точки зрения сегодня не настоящая пятница — просто день, когда завтра выходной. Поэтому статья в моей традиционной рубрике тоже будет не совсем настоящая, у неё пониженный градус безумия и повышенная полезность. Однако довольно предисловий, перейдём к сути.

Перед моими студентами регулярно встаёт задача случайного перемешивания массива. За её решением они, как правило, лезут в гугл. И гугл им подсказывает следующее:

var shuffledArr = arr.sort(function(){
  return Math.random() - 0.5;
});

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

Понимание жизненного цикла React-компонента

Время на прочтение9 мин
Охват и читатели191K
React предоставляет разработчикам множество методов и «хуков», которые вызываются во время жизненного цикла компонента, они позволяют нам обновлять UI и состояние приложения. Когда необходимо использовать каждый из них, что необходимо делать и в каких методах, а от чего лучше отказаться, является ключевым моментом к пониманию как работать с React.
Читать дальше →

Service Workers: прозрачное обновление кэша

Время на прочтение7 мин
Охват и читатели13K
Service Workes как технология для создания offline приложений очень хорошо подходит для кэширования различных ресурсов. Разнообразные тактики работы в сервис воркере с локальным кэшем подробно описаны в Интернете.

Не описано одного — каким образом обновлять файлы в кэше. Единственное, что предлагает Google и MDN, это делать несколько кэшей для разных типов ресурсов, и, когда нужно, изменять в скрипте сервис воркера sw.js версию этого кэша, после чего тот весь удалится.
Читать дальше →

Разработка Telegram бота для массфаловинга в Instagram

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


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

Скорее всего, некоторые из вас не знакомы с таким термином, вот небольшое описание:
Массфолловинг — массовая подписка на людей по определённым критериям.
Простым языком, вы подписываетесь на человека, он видит в ленте, что на него кто-то подписался, переходит к вам на страницу.

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

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

Расширения для VS Code и программирование на JavaScript

Время на прочтение6 мин
Охват и читатели66K
Одно из важнейших условий для продуктивной работы веб-программиста — хорошо настроенный редактор кода. Один из них — опенсорсный универсальный редактор Visual Studio Code, который замечателен не только тем, что он бесплатен, но и тем, как много полезного он умеет сразу после установки и минимальной настройки. Если речь идёт о том, чтобы использовать VS Code в какой-то конкретной сфере, вроде разработки на JavaScript, обычно стоит дополнить его несколькими расширениями, которые повышают производительность труда и упрощают жизнь программиста. Вокруг VS Code сложилось активное сообщество разработчиков расширений. Эти расширения легко искать и ещё легче устанавливать.



В материале, перевод которого мы сегодня публикуем, речь пойдёт о расширениях для VS Code, которые пригодятся тем, кто пишет на JS. Тут стоит отметить, что в деле выбора расширений для VS Code немалую роль играют личные предпочтения программиста. В результате можно сказать, что расширения, о которых пойдёт здесь речь, не являются абсолютно необходимыми. Не стоит рассматривать их как нечто, что обязательно нужно устанавливать и использовать. Обзавестись тем или иным расширением стоит лишь в том случае, если вам оно понравилось, и вы полагаете, что вам оно точно пригодится.
Читать дальше →

Оптимизируем веб с Виталием Фридманом, — компрессия, картинки, шрифты, фичи HTTP/2 и Resource Hints

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


В основе статьи расшифровка выступления Виталия Фридмана из Smashing Magazine на декабрьской конференции Holy JS 2017 Moscow.

Модуль Nchan веб-сервера nginx. Работа с Websocket, EventSource (Server-Sent Events), Long-Polling

Время на прочтение3 мин
Охват и читатели11K
В это статье будет сделан обзор возможностей модуля Nchan веб-сервера nginx, который заменил deprecated модуль NGiNX_HTTP_Push_Module. Модуль Nchan поддерживает основные технологии отправки сообщений Websocket, EventSource (Server-Sent Events), Long-Polling. Для горизонтального масштабирования используется кластер серверов redis.
Читать дальше →

Дайджест свежих материалов из мира фронтенда за последнюю неделю №313 (30 апреля — 6 мая 2018)

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


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

Анимации в мире состояний

Время на прочтение16 мин
Охват и читатели18K
Многие уже научились строить чистые интерфейсы и писать «undo-redo» в несколько строчек. Но как быть с анимациями? Часто их обходят стороной, и они не всегда вписываются в подход (state) ↦ DOM. Есть отличные решения вроде React Motion, но что если вам нужно делать сложные анимации или работать с Canvas, используя физический движок?

В нашем тексте рассказывается, как работать с анимациям в React-приложениях, и сравнивается несколько подходов (D3, React-Motion, «грязные компоненты»). А также о том, как «запускать» анимации в Redux-приложениях. Материал основан на расшифровке доклада Алексея Тактарова с нашей декабрьской конференции HolyJS 2017 Moscow. Прилагаем заодно видеозапись этого доклада:


Осторожно, трафик: под катом много картинок и гифок (сами понимаете, материал про анимации).

LAppS сервер приложений для микросервисной архитектуры

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

image


Предыстория


20-го декабря прошлого года я ушёл в отпуск, на целых 2 недели. Чем заняться в отпуске? Правильно, — кодом. Кодом, которым некогда заниматься в рабочее время. Последние несколько лет мне кодить приходилось очень мало. Руки стосковались. Какой код пишут в отпуске? Не знаю как вы, а я пишу велосипеды. Зачем? Причин может быть много, но основная, — мне интересно. Я люблю C++ и Lua. Я ещё и bash и awk люблю. Не закидывайте камнями, это личное, так получилось. JavaScript я не очень люблю (хотя последние 2 года если что-то и кодил то на JS), и это тоже личное.

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

Обзор докладов HolyJS 2018 Piter: от WebAssembly до Three.js

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


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

Сегодня у нас материал для вторых. В программу HolyJS 2018 Piter (19-20 мая) ещё вносят последние штрихи, но по ней уже можно сделать окончательные выводы. Самые разные темы (от особенностей TypeScript и утечек памяти при использовании RxJS до портирования компиляторов JS на процессоры Эльбрус) — рассмотрели в этом посте всё, что уже известно о докладах HolyJS.
Читать дальше →