Обновить
256K+

JavaScript *

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

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

Как исправить ошибку в Node.js и нечаянно поднять производительность в 2 раза

Время на прочтение8 мин
Охват и читатели45K
Началось все с того, что я оптимизировал отдачу ошибки HTTP 408 Request Timeout в сервере приложений Impress, работающем на Node.js. Как известно, у нодовского http.Server есть событие timeout, которое должно вызываться для каждого открытого сокета, если тот не закрылся за указанное время. Хочу уточнить, что не для каждого запроса т.е. не для каждого события request, функция которого имеет два аргумента (req, res), а именно для каждого сокета. Через один сокет может последовательно поступить много запросов в режиме keep-alive. Если мы задаем это событие, через server.setTimeout(2 * 60 * 1000, function(socket) {...}) то должны сами уничтожать сокет socket.destroy(). Но если не установить свой обработчик, то http.Server имеет встроенный, который уничтожит сокет через 2 минуты автоматически. На этом самом таймауте можно отдать ошибку 408 и считать инцидент исчерпанным. Если бы не одно но… С удивлением я обнаружил, что событие timeout вызывается и для тех сокетов, которые подвисли и для уже получивших ответ и для закрытых клиентской стороной, вообще для всех, находящихся в режиме keep-alive. Это странное поведение оказалось достаточно сложным, и я расскажу об этом ниже. Можно было бы вставить одну проверку в событие timeout, но со своим идеализмом я не удержался и полез исправлять баг на уровень глубже. Оказалось, что в http.Server режим keep-alive реализован не то что не по RFC, а откровенно не дописан. Вместо отдельного timeout для соединения и отдельного keep-alive timeout, там все на одном таймауте, который реализован на быстрых псевдо-таймерах (enroll/unenroll), но задан по умолчанию в 2 минуты. Это было бы не так страшно, если бы браузеры хорошо работали с keep-alive и переиспользовали его эффективно или закрывали бы неиспользуемые соединения.
Читать дальше →

Разработка HTML5 игры под Android с нуля и до релиза

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

Вместо вступления


Потратив несколько суток подряд (без перерыва на сон) на изучение поддержки HTML5 всеми любимыми Android-гаджетами, решил, что данной теме стоит уделить внимание. В статье постараюсь раскрыть по шагам все этапы (конечно же базовые/ключевые/основные) создания HTML5 Игрового приложения для Android от идеи до релиза самого APK файла. Возможно, ничего нового я и не открою маститым разработчикам, но для новичков постараюсь описать все как можно проще, со скриншотами и пояснениями.

image

Желающих узнать подробнее приглашаю под кат.
Читать дальше →

Пишем плагин под webpack

Время на прочтение8 мин
Охват и читатели21K
О webpack уже писали на хабре, рассказывали на moscowjs и есть несколько статей на других ресурсах, которые описывают общие возможности webpack’a, его достоинства и недостатки.

Поэтому в этой статье мы расскажем о самом webpack лишь вкратце и более подробно о разработке плагина под него.

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

Использование новых возможностей JavaScript в мире ES3

Время на прочтение8 мин
Охват и читатели21K
Здравствуйте, коллеги.

В последнее время мы эпизодически возвращаемся к теме JavaScript. Нас особенно заинтересовала очередная книга из серии «You Don't Know JS», посвященная стандарту ES6 (Кайл Симпсон):



Кстати, может быть кто-то уже присматривался к новой книге Адама Бодуха "JavaScript at Scale" и хотел бы увидеть ее на русском языке?



Об этом в опросе. А под катом — критическая (январская) статья мистера Коди Линдли, помогающая задуматься о том, насколько мир JavaScript готов к переменам.

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

7 советов, как улучшить работу вашего сайта в Microsoft Edge и других современных браузерах

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


Краткая справка: Microsoft Edge – это новый дефолтный браузер в Windows 10, пришедший на смену Internet Explorer. Помимо нового свежего интерфейса, под капотом браузера также находятся и обновленные движки EdgeHTML (изначально — форк движка IE11) и Chakra (для JS). Какое-то время браузер был известен под временным названием “Project Spartan”.

Вместе с ростом Windows 10 вы, наверняка, могли заметить на своих сайтах и рост числа пользователей Microsoft Edge. Поэтому самое время сделать несколько телодвижений, чтобы ваши сайты работали в Edge еще лучше.

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

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

Dojo 2

Время на прочтение4 мин
Охват и читатели12K
Dojo 2 уточняет и расширяет оригинальные интерфейсы Dojo, удаляя устаревшие функции и согласовывая терминологию в соответствии с дополнениями, внесенными в ECMAScript с момента первоначального выпуска Dojo в 2004 году. Цель Dojo 2 это поддержка только ECMAScript 5+. Так, особенности, которые были в Dojo 1 и которые стали частью спецификация ECMAScript, были удалены из фреймворка.

Dojo 2 написан на TypeScript. Это позволяет пользователям Dojo воспользоваться преимуществами дополнительной статической типизации и позволяет Dojo быть опубликованным в AMD, CommonJS и ES6 формате модулей для использования с нативными модульными системами в любом современном окружении.
image
Читать дальше →

Эмуляция CORS на стороне клиента: кроссбраузерное решение некоторых пользовательских задач без расширений

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

I. В чём проблема



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

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

Задачи, микрозадачи, очереди и планы

Время на прочтение8 мин
Охват и читатели74K
Предлагаю вашему вниманию перевод статьи «Tasks, microtasks, queues and schedules» Джейка Арчибальда (Jake Achibald), занимающего должность Developer Advocate for Google Chrome.

Когда я сказал своему коллеге Мэту Ганту, что подумываю о написании статьи об очерёдности микрозадач и порядке их исполнения внутри событийного цикла браузера, он сказал «Джейк, буду честен, я об этом читать не стану». Что ж, я всё же написал, поэтому откиньтесь на спинку кресла и давайте вместе в этом разберёмся, ладно?

На самом деле, если вам будет проще посмотреть видео, есть замечательное выступление Филиппа Робертса на JSConf, которое рассказывает о событийном цикле – оно не покрывает микрозадачи, но в остальном является отличным вступлением в тему. В любом случае, погнали…

Давайте рассмотрим следующий код на JavaScript:
console.log('script start');

setTimeout(function() {
  console.log('setTimeout');
}, 0);

Promise.resolve().then(function() {
  console.log('promise1');
}).then(function() {
  console.log('promise2');
});

console.log('script end');

Как вы думаете, в каком порядке должны вывестись логи?
Читать дальше →

Level Up для новичков: gulp и requirejs

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


Предисловие


Качество приложения зависит не только от того, какие задачи и с какой скоростью оно решает, но и от таких, казалось бы, второстепенных факторов как «красота кода».

Под красотой кода я (полагаю, и многие другие) понимаю:

  • Читабельность
  • Простоту изменения и дополнения
  • Возможность другим разобраться, как это работает

Каждый на заре своего пути разработчика писал код, который был способен решить определённую (часто даже непростую) задачу, но при попытке что-то изменить или адаптировать под похожую задачу возникали проблемы.
Да и презентабельность такого кода вызывала сомнения.

Давайте разберёмся с двумя инструментами, которые не смотря на свою простоту повысят презентабельность исходников вашего приложения и наведут порядок в голове.
Читать дальше →

Как в проекте заменить jQuery на D3

Время на прочтение7 мин
Охват и читатели19K
Создавая визуализации или интерактивные страницы, мы часто используем комбинацию из jQuery и D3. Причём в основном используется D3, а из jQuery берут небольшой набор функций для манипуляций с DOM.

И хотя в D3 есть мощные возможности – селекторы и обёртка для ajax, часто нам не хватает каких-то функций из jQuery. Мы покажем, как можно заменить jQuery, используя D3 повсеместно. В результате ваш код упростится, объём проекта уменьшится, и вы не будете смешивать разные подходы, а будете использовать функции так, как принято в D3.

Для начала рассмотрим, в чём эти две библиотеки сходятся. Это удобно для тех, кто уже знает jQuery, и хочет изучить D3.

Схожести


Селекторы

Обе библиотеки основаны на простых в использовании, но богатых на возможности селекторах.

jQuery

$('.foo').addClass('foobar');
$('.foo').removeClass('foobar');


D3

d3.selectAll('.foo').classed('foobar', true);  
d3.selectAll('.foo').classed('foobar', false); 


Управление стилями и атрибутами

jQuery

$('.foo').attr('data-type', 'foobar');
$('.foo').css('background', '#F00');


D3

d3.selectAll('.foo').attr('data-type', 'foobar');  
d3.selectAll('.foo').style('background', '#F00');  

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

Дайджест интересных материалов из мира веб-разработки и IT за последнюю неделю №172 (9 — 16 августа 2015)

Время на прочтение7 мин
Охват и читатели31K
Предлагаем вашему вниманию подборку с ссылками на полезные ресурсы, интересные материалы и IT-новости


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

Внедрение компонентого подхода в вебе: обзор веб-компонентов

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


Четыре из пяти самых запрашиваемых новых платформенных возможностей Edge на User Voice (Shadow DOM, Template, Custom Elements, HTML Imports) относятся к семейству API, называемых веб-компонентами (Web Components). В этой статье мы хотим рассказать о веб-компонентах и нашем взгляде на них, некоторой внутренней кухне, для тех, кто еще с ними не знаком, а также порассуждать на тему того, куда все это может эволюционировать в будущем. Это довольно-таки длинный рассказ, поэтому откиньтесь назад, возьмите кофе (или не кофеиновый напиток) и начинайте читать.

Содержание:
  • Внедрение компонентов: старая практика проектирования, ставшая новой для веба
  • Как разбивать на компоненты
  • Это все не в первый раз: предыдущие подходы к внедрению компонентов
  • Современные веб-компоненты
  • Веб-компоненты: следующее поколение

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

Релиз Cordova 5.2.0

Время на прочтение3 мин
Охват и читатели13K
Сегодня вышел новый релиз Apache Cordova — 5.2.0.

Основные изменения в данном релизе это
  • Поддержка флага --browserify
  • Поддержка Windows в plugman
  • Новая команда clean
  • Использование ~ вместо ^ по умолчанию в config.xml при использовании --save


Также намного больший упор делается на использование NPM вместо собсвенного реестра плагинов.

Подробнее под катом.

Также будет немного о предстоящих релизах и вопросы по документации.
Читать дальше →

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

Можно ли полагаться на данные, извлекаемые WMI классами?

Время на прочтение3 мин
Охват и читатели11K
На примере нескольких WMI-классов Win32_xxxx, показано, что как минимум некоторые из свойств объектов, возвращаемые указанными классами, совершенно не соответствуют реальным значениям этих свойств.
Читать дальше →

Работа с формами в Webix UI

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


Создание форм с помощью чистого HTML задача довольно тривиальная и подробно обсуждается в каждом уважающем себя учебнике. Но все становится куда сложнее, если вам нужно, например, разнести элементы формы по нескольким табам. В этом случае без фреймворка не обойтись. В этой статье я расскажу, как можно создать сложные веб-формы с помощью UI-фреймворка Webix.

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

Практические советы по повышению производительности HTML и JavaScript

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


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

Скорость работы веб-приложений условно зависит от трех составляющих: 1) как устроена сетевая инфраструктура, через которую доставляются данные и код, 2) как работает браузер и 3) как, собственно говоря, написан ваш код, который браузер должен исполнять.

Все три компоненты постоянно улучшаются и оптимизируются. Например, в сетевом стеке определенные общие улучшения несет переход на HTTP 2.0. С точки зрения браузеров, все производители постоянно работают над улучшением своих движков. В случае Chakra в Microsoft Edge, помимо общего повышения производительности работы с JavaScript, мы добавляем поддержку специализированных средств вроде Asm.js и SIMD.js, призванных повысить эффективность кода в специфичных сценариях (в Firefox и Google Chrome — аналогично).

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

Наши коллеги Дорис Чен и Джон-Дэвид Далтон подготовили целый курс с практическими советами по улучшению производительности вашего кода на HTML и JavaScript. Вы можете посмотреть его на соответствующей странице в Microsoft Virtual Academy или под катом в виде отдельных роликов.

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

Javascript и часовые пояса — правильное время на сайте

Время на прочтение3 мин
Охват и читатели45K
До сих пор существует путаница при реализации местного времени на сайте. Изрядный вклад в эту путаницу внесли российские законодатели с периодической отменой перехода на зимнее время. Вот Вы знаете какой сейчас у нас часовой пояс +3 или +4 часа? Вот и большинство пользователей этого не знают. Но есть очень простое решение как не отягощать пользователя этой проблемой! Нужно использовать время устройства (исходим из того, что это корректное местное время). Очевидное решение использовать функцию javascript getTimezoneOffset является в корне неправильным. Почему? Читайте дальше.
Читать дальше →

Универсальный JavaScript

Время на прочтение2 мин
Охват и читатели28K
В начале был Netscape. И возжелал Netscape выполнять Scheme-код в браузере Netscape Navigator. И наняли они Брендана Айка (Brendan Eich), чтобы он в поте лица своего работал над этим. Но потом они передумали и решили, что Java хотят они. И вот, рождён был JavaScript. И было это (достаточно) хорошо.

Безумная идея овладела Райаном Далом (Ryan Dahl) годы спустя: подружить движок V8 с библиотекой libev, дабы могли программисты выполнять свой JavaScript-код за пределами браузера. И возник Node.js. И npm. И люди возрадовались.

И стали люди писать веб-сервера на JavaScript, и запускать вертолёты с JavaScript на борту, и водружать его на планшеты и смартфоны, и встраивать его в термостаты и холодильники, да и во всё, во что их душа желала. И распространился JavaScript весьма и весьма широко. И презирали Нормальные Программисты™ (Serious Developers) простых людей, пишущих на JavaScript, но простые люди продолжали писать на JavaScript всё больше и больше.

И ждали люди Слово, способное вместить в себя всю широту проникновения JavaScript, ибо слово «JavaScript», как оно есть, более не вмещало той широты. И изрёк Чарли Роббинс (Charlie Robbins) мысль, что термином «Isomorphic JavaScript» можно назвать JavaScript-код, выполняющийся и в браузере, и на сервере. И никто нафиг не понимал значения сего, но, вместо просто программирования на JavaScript, люди стали программировать на изоморфном JavaScript.

Секундочку, что?
Читать дальше →

Третий набор в Школу разработки интерфейсов Яндекса. Разбор вступительных заданий и полезные советы

Время на прочтение10 мин
Охват и читатели32K
Осталось совсем немного до окончания набора в третью Школу разработчиков интерфейсов, которая в этот раз пройдёт в Москве. Упор в ней будет сделан на практику в формате виде мини-хакатонов. Его мы уже опробовали в прошлом году в Минске и Екатеринбурге. Студенты будут делиться на команды, и уже командно реализовывать проект. Кроме написания самого кода, нужно будет уметь принимать решения, разбираться с возникшими спорными вопросами, разбивать весь процесс разработки на логические итерации. Помогать в этом будут ребята из Яндекса, которые будут работать индивидуально с каждой командой. Занятия начнутся 7 сентября.

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

Вступительное испытание в Школу тоже очень практическое. Мы закончим принимать заявки 16 августа в 23:59. Пока есть еще время справиться с заданиями, мы попросили наших преподавателей немного помочь будущим студентам и на примере прошлогодней анкеты объяснить, какой логикой стоит руководствоваться, решая предложенные задачи, и рассказать, чему они уделяют внимание при их проверке.

image

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

Легковесный модуль для HTTP запросов

Время на прочтение2 мин
Охват и читатели18K
Все началось с того, что передо мной встала задача написать бота для Telegram, здесь, я первый раз столкнулся с их API. Для работы с ним я выбрал популярный на сегодняшний день модуль Request.

Бот был написан. Я заметил, что потребление им памяти росло с каждым запросом к API, уличив в проблеме тяжеловесный Request, я решил попробовать написать свой модуль для HTTP запросов, максимально простой, легковесный и быстрый.

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