Обновить
256K+

JavaScript *

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

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

Дорогой JavaScript,

Время на прочтение7 мин
Охват и читатели33K
Мне хочется рассказать тебе о проблеме в нашем сообществе.

Я участвовал во множестве открытых проектов, таких как Babel, Flow, Yarn, Lerna, и других. Как разработчик, мне посчастливилось стать частью самых лучших времён сообщества, равно как и худших.

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

Но боюсь, это не всё, с чем я сталкивался.
Открыть письмо

Electron: от мотивации до публикации

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

— Хотел бы я иметь приложение, которое умеет что-то такое, что мне надо. Жаль такого нет.
— А почему бы тебе его самому не написать?
— Это сложно, мне потребуется куча времени, чтобы понять теорию, приступить к практике и, скорее всего, ничего хорошего не выйдет. А вообще я frontend-разработчик и привык к HTML, CSS и JS. Этот стек не позволяет писать десктопные приложения.
— Electron!

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

Как аккуратно залезть в кишки WebRTC при передаче голоса и видео

Время на прочтение5 мин
Охват и читатели13K
WebRTC — технология интересная, но чуток запутанная. В первую очередь тем, что это не одна технология, а комбайн. Захват видео с камеры и звука с микрофона. Установка peer-to-peer подключения между двумя браузерами с протыканием NAT по мере возможности. Передача звука и видео по этому подключению, с пониманием, что передаются realtime данные: кодеки, пропускная способность, потеря кадров, вот это всё. Ну и, наконец, воспроизведение полученного в окне другого браузера. Или не браузера, это уже как зайдет. Ах да, еще — realtime передача пользовательских данных по той же схеме для игр, датчиков и всего того, где недопустимы лаги tcp websocket. Мы в Voximplant постоянно копаемся в кишках технологии, чтобы у клиентов были качественные звук и видео во всех случаях, а не только по локальной 100-мегабитке. И нам было очень приятно почитать на прошлой неделе интересную статью, которая рассказывает, как в этих кишках правильно копаться. Предлагаем вам тоже почитать адаптированный перевод, специально для Хабра!
Читать дальше →

Рецепт разработки бота под Telegram

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


Добрый день, уважаемые читатели Хабрахабра!

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

Статья может быть интересна как новичкам в программировании — увидеть, сколько препятствий стоят на пути у готового продукта, так и более продвинутым специалистам — где-то посмеяться, где-то поплакать, где-то написать комментарий «жизненно».

Преамбула


И так, что же может сделать один программист за 4 дня?
Читать дальше →

React, Web Components, Angular и jQuery — друзья навеки. Универсальные JavaScript-компоненты

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

image
Эта статья о том, как написать универсальный JavaScript-компонент, который можно будет использовать


  • как React-компонент;
  • как Preact-компонент;
  • как Angular-компонент;
  • как Web Component;
  • как jQuery функцию для рендеринга в DOMElement;
  • как нативную функцию для рендеринга в DOMElement.

Зачем и кому это нужно


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

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

Logux: Connection lost, data synchronized – интервью с Андреем Ситником (Злые Марсиане)

Время на прочтение6 мин
Охват и читатели13K
Что происходит, если вдруг на клиенте пропадает интернет? Возможно, на долю секунды, а может быть, на более ощутимый период? Все мы как пользователи сталкиваемся с нестабильным сигналом, плавающим качеством связи. Иногда это неважно, ведь хочется посмотреть какое-то весёлое видео, иногда от этого может зависеть очень многое – представьте, что вам срочно надо купить билет на поезд или оплатить тот же самый интернет.

Те сферы, где очень важен конечный пользователь – например, СМИ, говорят, что уже 13% пользователей уходят, если ваш сайт открывается больше четырёх секунд, не разбираясь в причинах. А теперь давайте представим такого пользователя, который еще пробует отправить комментарий, и он постоянно «отваливается» из-за проблем со связью?

Процент уходов и отказов будет заведомо больше. Как этого избежать? Что можно сделать в ситуации, когда данные должны быть гарантированно отправлены как от клиента, так и со стороны сервера?

На этот и другие вопросы отвечает Андрей Ситник – автор PostCSS и Автопрефиксера, ведущий фронтендер в «Злых Марсианах».









– Почему мы вообще говорим о проблемах связи? Разве это не вопрос, исключительно связанный с физическими/сетевыми возможностями?

– OSI тут не совсем в тему. Logux заменяет REST и AJAX. То есть это чисто прикладной уровень. Logux решает следующие проблемы:
Читать дальше →

Mozilla и Tor закрыли критическую уязвимость, которая активно использовалась для деанонимизации пользователей Tor

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


Разработчики Mozilla и Tor в срочном порядке выложили патчи для браузеров, которые устраняют критическую 0day-уязвимость браузера под Windows, Mac и Linux. По мнению независимого эксперта, новый эксплойт почти в точности идентичен эксплойту для 0day-уязвимости 2013 года (исполнение произвольного кода после загрузки в браузер специально составленного JS-скрипта), которую успешно использовало ФБР для деанонимизации пользователей Tor, в том числе посещавших сайты с детской порнографией.
Читать дальше →

20 полезных Node.js фреймворков

Время на прочтение8 мин
Охват и читатели87K
За последние годы Node.js значительно повысил свой статус от экспериментальной технологии до основы для серьезных проектов. Node.js дает возможность построить достаточно сложные, высоконагруженные приложения на простом, элегантном и, самое главное, легковесном механизме. Но прежде всего Node.js – это совершенно увлекательная и захватывающая вещь, с которой по-настоящему интересно работать!

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

Пишем свой язык программирования без мам, пап и бизонов. Часть 0: теория

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

Тема написания своего ЯПа не дает мне покоя уже около полугода. Я не ставил перед собой цель "убить" CoffeeScript, TypeScript, ELM, тысячи их, я просто хотел понять кухню и как они вообще пишутся.


К моему неприятному удивлению, большинство из этих языков используют Jison (Bison для JavaScript), а это не совсем попадало под мою задачу — "понять", так как по сути дела Jison делает все за вас, собирает AST по заданным вами правилам (Jison как таковой отличный инструмент, который делает за вас львиную долю работы, но сейчас не о нем).


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


Стоит заметить, что данное руководство не привязано к JavaScript, он выбран исключительно из соображений скорости разработки и читаемости, так что вы можете написать свой "лисп"/"питон"/"ваш абсолютно новый синтаксис" на любом знакомом вам языке.


Также до момента написании компилятора (в нашем случае транслятора), процесс написания языка не отличается от процессов создания языков компилируемых в ASM/JVM bitcode/LLVM bitcode/etc, а это значит, что данное руководство не ограничивается созданием языка трансляцируемого в JavaScript.


Весь код, который будет написан в данной (и последующих статьях), лежит на Github'е. Тегами обозначены начало и концы статей для удобства.


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

Дайджест свежих материалов из мира фронтенда за последнюю неделю №238 (21 — 27 ноября 2016)

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


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

Консоль разработчика Google Chrome: десять неочевидных полезностей

Время на прочтение6 мин
Охват и читатели241K
Как с помощью консоли разработчика превратить Google Chrome в подобие текстового редактора? Какой смысл в ней приобретает знакомый многим по jQuery значок $? Как вывести в консоль набор значений, оформленный в виде вполне приличной таблицы? Если сходу ответы на эти вопросы в голову не приходят, значит вкладка Console из инструментов разработчика Chrome ещё не раскрылась перед вами во всей красе.

image

На первый взгляд, перед нами – вполне обычная JavaScript-консоль, которая годится только на то, чтобы выводить в неё логи ответов серверов или значения переменных. Я, кстати, так ей и пользовался, когда только начал программировать. Однако, со временем набрался опыта, подучился, и неожиданно для себя обнаружил, что консоль Chrome умеет много такого, о чём я и не догадывался. Хочу об этом сегодня рассказать. Да, если вы читаете сейчас не на мобильнике, можете тут же всё это и попробовать.
Читать дальше →

WebRTC: Делаем peer to peer игру на javascript

Время на прочтение13 мин
Охват и читатели40K
Недавно мне довелось поработать над прототипом видеочата. Это был отличный повод поближе познакомиться с концепциями WebRTC и опробовать их на практике. Как правило, когда говорят про WebRTC, подразумевают организацию аудио- и видеосвязи, но эта технология может применяться и для других интересных вещей. Я решил попробовать сделать peer-to-peer игру и поделиться опытом ее создания. Видео того что получилось и подробности реализации под катом.


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

Функциональное тестирование современных web-приложений

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


Современные web-приложения зачастую содержат множество "движущихся частей" и сторонних зависимостей. В процессе рефакторинга и добавления/изменения функциональности в таком приложении может произойти поломка существующих use-case сценариев и нестабильная работа в определенных браузерах.


Для своевременного обнаружения таких ситуаций и выполнения непрерывной интеграции необходимо функциональное тестирование web-приложения. В статье пойдет речь о двух бесплатных open-source решениях:


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

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

React.js State of the art (интервью с Max Stoiber)

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


Современная разработка веб-интерфейсов сосредоточена вокруг нескольких больших сообществ. На протяжении последних пяти лет React завоевывал симпатии программистов из самых разных отраслей. React – это одна-единственная библиотека, сделавшая MVC рудиментарным в программировании веб-интерфейсов. Сегодня React используется крупнейшими компаниями для разработки самых разнообразных продуктов — Facebook, Airbnb, BBC, Coursera, eBay, Expedia, IMDB, список можно продолжать.

Одной из уникальных особенностей мира React является крупнейшее и очень активное сообщество опенсорс-разработчиков вокруг него. Max Stoiber — один из людей, благодаря которым React стал тем, чем он является на сегодня как проект. На протяжении последних нескольких лет он работал над популярнейшим boilerplate проектом в сообществе и внедрял новейшие и лучшие технологии в массовое использование.

Мы поговорили с Максом о новых веяниях в сообществе, о статической типизации для разработки с React, о новом подходе стилизации компонентов и о snapshot-тестировании.

К секретам разработки на React можно приобщиться ниже в интервью.
Читать дальше →

Qemu.js с поддержкой JIT: фарш всё же можно провернуть назад

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

Несколько лет назад Фабрис Беллар написал jslinux — эмулятор ПК, написанный на JavaScript. После этого был ещё как минимум Virtual x86. Но все они, насколько мне известно, являлись интерпретаторами, в то время как написанный значительно раньше тем же Фабрисом Белларом Qemu, да и, наверное, любой уважающий себя современный эмулятор, использует JIT-компиляцию гостевого кода в код хостовой системы. Мне показалось, что самое время реализовать обратную задачу по отношению к той, которую решают браузеры: JIT-компиляцию машинного кода в JavaScript, для чего логичнее всего виделось портировать Qemu. Казалось бы, почему именно Qemu, есть же более простые и user-friendly эмуляторы — тот же VirtualBox, например — поставил и работает. Но у Qemu есть несколько интересных особенностей


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

На счёт третьего пункта теперь-то я уже могу пояснить, что на самом деле в режиме TCI интерпретируются не сами гостевые машинные инструкции, а полученный из них байткод, но сути это не меняет — чтобы собрать и запустить Qemu на новой архитектуре, если повезёт, достаточно компилятора C — написание кодогенератора можно отложить.


И вот, после двух лет неспешного ковыряния в свободное время исходников Qemu появился работающий прототип, в котором уже можно запустить, например, Kolibri OS.

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

Дайджест свежих материалов из мира фронтенда за последнюю неделю №237 (14 — 20 ноября 2016)

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


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

Про веб-клиент 1С

Время на прочтение9 мин
Охват и читатели122K
Одной из приятных особенностей технологии 1С:Предприятие является то, что прикладное решение, разработанное по технологии управляемых форм, может запускаться как в тонком (исполняемом) клиенте под Windows, Linux, MacOS X, так и как веб-клиент под 5 браузеров – Chrome, Internet Explorer, Firefox, Safari, Edge, и все это – без изменения исходного кода приложения. Более того – внешне приложение в тонком клиенте и в браузере функционирует и выглядит практически идентично.
Найдите 10 отличий (под катом 2 картинки):
Читать дальше →

CleverScrollbar.js — Сайдбар для понятной навигации

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

Для тех, кому хочется сразу посмотреть, о чём идёт речь: пример работы библиотеки. Нажмите на кнопку "Load Scrollbar!", чтобы увидеть результат.


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


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

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

Дайджест свежих материалов из мира фронтенда за последнюю неделю №236 (7 — 13 ноября 2016)

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

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

Математика в JavaScript

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

Введение


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

От переводчиков


Всем привет, с вами Максим Иванов и Дмитрий Сергиенков, и сегодня мы решили, что мы не будем говорить о модных и полезных штуках типа ReactJS, Angular, TypeScript и других. Сегодня мы уделим внимание математике в JavaScript. Если вам нравится математика, вы можете заниматься ей всё свободное время, но если вашей целью являются не научные изыскания, а работа программистом, математика вряд ли станет лучшим объектом для изучения.
Читать дальше →