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

• Побеседовать на тему «ООП с человеческим лицом».
• Разобраться с прототипами в javascript, коротко и сердито!
• Вспомнить, что «замыкание» это не только ценный мех… удар током.
• Написать на javascript класс Timer — этакий планировщик событий для запуска анимаций, событий, любых функций.
• Весело провести время!

Предупреждение! Если вы не ждете от статьи ничего веселого… то ошибаетесь. Людям с пониженным чувством юмора читать… еще более рекомендуется! Ну-с, приступим…

Недавно я писал, что Greensock, прекрасная библиотека для скриптовой анимации на Flash, теперь поддерживает и JavaScript. В этой статье я продемонстрирую основы работы с GSAP v12 (beta). Результат будет примерно таким:


Сразу оговорюсь, что графику и идею для примера я взял из документации $fx(), ведь кто из нас откажется

В статье рассказывается о возможностях собственной реализации прогрессивной загрузки изображений на сайте без использования Flash. Интерактивное рисование реализуется через элемент: canvas из HTML5. Алгоритмическая основа процесса является дискретное вейвлет-преобразование.

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

22 ноября 2011 года JiLiZART всем нам сообщил, что есть на свете полезная библиотека JSZip с открытым исходным кодом, написанная на джаваскрипте и умеющая создавать zip-архивы (и даже, если это необходимо — с подкаталогами) из скормленных ей текстовых и двоичных данных.

Первым же комментарием к его сообщению стали мои слова:

 — Прекрасно.

 — Теперь ему бы ещё распаковывать уметь.

Прошло полгода с тех пор, и можно видеть, что это естественное пожелание сбылось: очевидно, оно пришло на ум не одному мне, так что программисты принялись за дело — и в открытый на Гитхабе исходный код JSZip добавили методы, способные служить ещё и распаковке zip-архивов, а не только составлению их. (Подробности употребления новинок API смотрите в документации.)

В открытом коде всегда приятно видеть, как другие люди действуют в направлении твоих мыслей.

Поклонникам же джаваскриптового движка Node.js будет наверняка не менее приятно узнать о появлении модуля node-zip, содержащего весь код JSZip, оформленный в качестве модуля Node. Стало быть, теперь JSZip можно запускать не только во браузере, но и на сервере, а равно и у себя на компьютере.

Сегодня у меня две причины пробежаться по клавишам.

Во-первых, после того, как на прошлой неделе я перевёл документацию по jParser (после ознакомления с RReverserовским примером применения jParser при анализе BMP-файлов), мне представляется уместным перейти к напрашивающемуся последующему шагу: развить тему, поделиться с читателями моим собственным примером применения jParser для анализа несколько более сложной структуры данных. (Отчасти это станет ответом на вопрос, который alekciy задал, интересуясь дальнейшими примерами практического использования jParser.)

Во-вторых, ≈полгода назад (26 ноября 2011 года) ertaquo поинтересовался, зачем мне хочется использовать Node.js в Фидонете. Тогда я сообщил, что мне просто нравится название (помню те времена, когда термин «node» или «нóда», если употреблялся без уточнения, в российском околокомпьютерном мире по умолчанию означал узел Фидонета), но не мог привести никакого наглядного примера работающего кода, а сейчас приведу.

Итак, пример будет двойным. Предлагаю вашему вниманию анализ заголовков писем фидонетовской эхопочты, хранимой в формате JAM. Этот формат популярен в Фидонете со времён далёких и незапамятных (в Википедии говорится, что появление JAM относится к 1993 году). Сразу скажу, что давно предпочитаю JAM другому популярному формату (Squish), потому что этот последний хранит в заголовке у письма идентификаторы не более чем девяти откликов на него, тогда как JAM вместо массива ограниченной длины использует более гибкую структуру данных (связный список), так что позволяет выстроить полное дерево ответов даже в самых оживлённых и разветвлённых обсуждениях.

Обновляя недавно дизайн своего хомяка, подумал – а не сделать ли мне какую-нибудь необычную страницу с 404-й ошибкой? Поскольку в детстве я был впечатлен Жизнью Конуэя (как возможно и многие из читателей), решил её на JS и реализовать.

Казалось бы, что сложного в Жизни: если у занятой клетки 2 или 3 соседа – она остается, если у пустой ровно 3 – рождается? В этой статье я расскажу о своей оптимизации алгоритма и отрисовки на canvas-е, некоторых не очевидных моментах целочисленной/бинарной арифметики в JavaScript.

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

Сейчас почти не осталось препятствий для создания полноценного SIP клиента в браузере. Необходимый для видео конференций WebRTC уже можно протестировать, например, в Chrome Canary. Существует draft-ibc-sipcore-sip-websocket, который добавляет WebSocket в качестве еще одного транспорта для SIP. И уже появляются первые реализации SIP клиентов:



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

Удивительно, но факт: на хабре практически нет статей о Greensock — великолепной библиотеке для скриптовой анимации на Flash. Возможно, это связано с тем, что Flash-разработчиков тут меньше, чем веб-разработчиков?

Впрочем, теперь уже не важно: Greensock v12 (он же Greensock Animation Platform или GSAP) умеет анимировать на JavaScript. Любое свойство любого объекта можно проанимировать десятками способов, соединить анимации в таймлайн, поставить этот таймлайн на паузу или развернуть задом наперёд. Всего парой строчек.

Более того, Greensock работает значительно быстрее jQuery, YUI, MooTools или Dojo. Разработчики говорят о тысячах процентов, но зачем верить на слово, когда есть animation speed test.

Подробности на английском: www.greensock.com/v12/, а под катом — краткое изложение на русском языке.

Статистика HTTP Archive демонстрирует взрывной рост JavaScript в вебе. Год назад средний объём скриптов на странице составлял 128 КБ, а сейчас уже 189 КБ.



С одной стороны, приятно, что этот язык программирования переживает нечто вроде возрождения и всеобщей популярности. С другой стороны, увеличение объёма скриптов нагружает браузер и негативно отражается на времени загрузки страниц. Грустно, что для загрузки одного твита (140 символов) требуется 1,65 мегабайта скриптов.

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

Библиотека для работы HTML5 History API

Изначально этот проект был задуман добавить поддержку HTML5 History API в старые HTML4 браузеры. Первые версии библиотеки были нацелены именно на эти потребности, но с учетом прошедшего времени и пожеланий многоуважаемых разработчиков использующих эту библиотеку, она выросла до уровня того, что выполняет некие промежуточные действия по добавлению/исправлению того функционала что описаны в спецификациях по интерфейсу History.

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

jParser делает простым чтение структур данных из двоичных файлов джаваскриптом.

• Вы один раз описываете структуру, анализ её происходит автоматически.
   
• Процесс анализа данных может быть расширен самописными функциями. Чем упрощается разбор нетривиальных файлов.
   
• jParser действует и во браузере, и в NodeJS, потому что работает на основе jDataView.

API

Элементарные структуры:

• Целые числа без знака: uint8, uint16, uint32
   
• Со знаком: int8, int16, int32
   
• Дробные с плавающей точкой: float32, float64
   
• Строковые: char, string(len)
   
• Массив: array(type, len)
   
• Положение: tell, skip(len), seek(pos), seek(pos, func)

Методы jParser:

Идентификаторы длиной больше 15 встречаются реже односимвольных. Чаще всего встречаются 6-cимвольные имена. Такие результаты получил автор Esprima — парсера для JavaScript, написанного на JavaScript, проанализировав исходный код таких библиотек, как jQuery, Prototype, MooTools, Underscore и некоторых других.

Пятёрка самых длинных идентификаторов выглядит так:

prototype-1.7.0.0.js	SCRIPT_ELEMENT_REJECTS_TEXTNODE_APPENDING
prototype-1.7.0.0.js	MOUSEENTER_MOUSELEAVE_EVENTS_SUPPORTED
jquery-1.7.1.js	subtractsBorderForOverflowNotVisible
jquery.mobile-1.0.js	getClosestElementWithVirtualBinding
prototype-1.7.0.0.js	HAS_EXTENDED_CREATE_ELEMENT_SYNTAX

Добрый день, хабровчане!

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

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

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

Информация в статье касается ECMAScript, но может использоваться и в других RegExp Движках (хотя и есть вероятность, что там есть более подходящее решение).

Если примеры кажутся вам сложными, рекомендую играть с ними в консоли, по мере прочтения. И Заранее прощу прочтение за пугающее название.

Статья

Если вы какое-то время используете регулярные выражения, то наверняка вы сталкивались с разными вариантами следующих задач:

• Пересечение:«Что-то, что совпадает с шаблоном А и шаблоном Б»
  Например: Пароль, минимум 6 символов, в котором хотя бы одна цифра, хотя бы одна буква, и хотя бы один специальный символ
  
  
• Исключение: «Я хочу что-то, что совпадает с шаблоном А, но не совпадает с шаблоном Б»
  Например: Любое целое число, которое не делится на 50
  
  
• Отрицание: Все. Что не совпадает с шаблоном А
  Например: Строка, которая не содержит в себе слово «Foo»

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

Можно каждый раз писать JavaScript-код и стили к нему, но со временем это приводит к разрастанию кода, с чем в определенный момент мы и столкнулись.

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

Предположим, вам не нужен полноценный шаблонизатор для веб-проекта, но с другой стороны периодически встречаются места в коде, где хорошо бы отделить HTML от JavaScript-а. В таком случае, одним из решением может быть использование варианта самой простой шаблонизации на основе JavaScript.
Исходный код.
Демо

Видео (выбираем HD для наиболее удобного просмотра):

К каждому, кто сталкивался с разработкой сайтов под iOS/Android/etc (или native-приложений через phonegap и иже с ним), рано или поздно наверняка приходило осознание того факта, что стандартные управляющие элементы форм не очень удобны для работы с touch-экранов.

И если input'ы и textarea вполне можно отрисовать с помощью css, то с селекторами ситуация гораздо более грустная — и не улучшить особо, и выбирать, например, дату, последовательным выбором трех выпадающих списков — занятие не из приятных.
Помогает в решении этой проблемы мультиплатформенный (обещают как минимум работу на iOS/Android, но с некоторыми помарками работает и на MeeGo — это из проверенного собственноручно) select-заменитель Mobiscroll, с некоторым трудом нагугленный мной пару недель назад.

Статья является дополненным переводом статьи «HOWTO: Port a C/C++ Library to JavaScript (xml.js)» (автор: azakai). Автор оригинальной статьи имеет приличный опыт портирования C/C++ библиотек в JavaScript. В частности, он успешно портировал lzma.js и sql.js. В своей статье он описывает общую схему портирования C/C++ кода на примере libxml – открытой библиотеки для валидации XML.