JavaScript *

На Хабре уже рассказывали про замечательную игру CodeCombat, которая помогает изучать Javascript в нескучной игровой форме. Но в битве Greed столкнулись отнюдь не новички, а настоящие профессионалы.

Во время соревнования 545 участников написали более 126 000 строк кода. Каждый потратил в среднем 10 часов на подготовку заданий, что соответствует 7,5 человеко-месяцам разработки. Обсчёт итога происходил на 673-ядерном кластере, который за один час просчитал результат всех 153 439 игр. Победители заберут призов на сумму более $40 000.

Анимация в вебе была одна из областей JavaScript, но сейчас, когда мир пересел на мобильные устройства, анимация переместилась на CSS. Это позволило нам использовать декларативный синтаксис при описании анимации, а браузеру производить оптимизацию. В погоне за 60fps (60 кадров в секунду) на мобильных устройствах, вам будет полезно знать все тонкости и нововведения, касающиеся механизмов эффективного отображения анимации в ваших браузерах.

Введение

Грядет революция. Появилось новое дополнение к JavaScript, которое изменит всё, что вы когда-либо знали о дата-байндинге. Помимо этого, изменится и подход ваших MVC библиотек к наблюдениям за редактированием и обновлением моделей. Вы готовы?

Хорошо, хорошо. Не будем тянуть. Я рад вам представить Object.observe(), который появился в бета версии Chrome 36. [ТОЛПА ЛИКУЕТ]

Object.observe() является частью следующего ECMAScript стандарта. Он позволяет асинхронно отслеживать изменения JavaScript объектов… без использования каких-либо сторонних библиотек, он позволяет наблюдателю отслеживать изменения состояния объекта во времени.

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

Итак, мы получим небольшое мобильное веб приложение, которое сможем запускать под несколькими мобильными платформами, кликнув при этом только несколько кнопок мыши.

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

Начиная с версии 35 (35.0.1916.114 m), как известно (англ.), браузер Google Chrome для ОС Windows перестал поддерживать установку новых и работу прежде установленных расширений, размещённых не в магазине Chrome WebStore. Это же касается и всех юзерскриптов, не размещённых в этом магазине. Группа Windows-пользователей — обширна, поэтому требуются новые инструкции о том, как с этим бороться. Линуксоидам и маководам это, к счастью, пока не грозит.

Замечательные новости для всех интересующихся разработкой на JavaScript и .NET! Днепропетровский офис компании Ciklum приглашает всех желающих посетить Ciklum JavaScript/ .NET Saturday 21го июня.

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

«Если человек умер, он об этом не знает, только другим тяжело. То же самое, когда он тупой...»

И то же самое, когда он безграмотный.

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

А что, если подойти к этой проблеме с другой стороны? Как было бы здорово иметь такой браузер, который при открытии страницы проверял бы текст и исправлял все ошибки. Или хотя бы часть. Ведь, по правде говоря, ошибки воспринимаются по-разному: забытая запятая скорее всего останется незамеченной, в то время как какие-нибудь «извени» или «правельно» вызывают кратковременное бешенство.

Что будет, если перед чтением страницы пропустить ее через фильтр и исправить орфографию, наподобие того как adblock режет рекламу?

Вы писали крупные проекты используя JS? У вас было много объектов в объектах объектов (напр. LIB.Module.object.param)? У меня такое было часто и это вызвало довольно большое неудобство и плохой вид кода. Аналогично часто приходилось использовать анонимные функции, они выглядят не особо аккуратно.

Аннотация

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

Идея в трёх строчках

Для нетерпеливых показываю основную идею:

printf "\x00\x03\x00\x00\x00\x01\x85\xDB" > $tty
( dd if=$tty of=$ans count=256 2> /dev/null ) & /usr/bin/sleep $timeout; kill $!
echo "[`hexdump -ve '1/1 "%d,"' $ans | sed 's/\(.*\),/\1/'`]"

Как-то поиграв в оффисе в hexbug, зародилась идея написать игрушку по схожим мотивам.
По текущему роду деятельности я веб разработчик и поэтому захотелось чтобы в игре использовался только HTML, JavaScript и CSS — средства знакомые каждому вебразработчику. Никакого вам flash или даже canvas. Звучит хардкорно, но на самом деле сейчас HTML + CSS3 это очень мощные и гибкие средства визуализации, а писать игровой код на JavaScript — одно удовольствие. Вдобавок захотелось чтобы игра была с сетевым мультиплеером, притом интерактивной — никаких там шашек, карточных игр, пошаговых стратегий, все должно быть в действии и движении.

Вот что получилось в итоге:



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

Веб-сайт Who Am I? использует «продвинутые достижения нейробиологии», чтобы определить увлечения любого человека. Для верного анализа достаточно выполнить простую процедуру: в произвольном порядке щёлкнуть по всем красным квадратикам в массиве.



И после этого нажать кнопку “done!”

Холодным Апрельским днем когда на Урале еще не растаял снег. Смеркалось. Я игрался с микро-шаблонами.

Всю документацию на английском языке вы сможете прочесть на maxmert.com.

Требования и задачи

При создании версии 1.0 мне пришлось пересмотреть основные требования к фреймворку:

• Возможность легко добавить/удалить размер или тему. Json-файл с прописанными темами и размерами для каждого виджета. Таким образом можно конфигурировать фреймворк исправляя json-файл.
• Модульность. При отключении или добавлении любого виджета фреймворк должен стабильно работать (привет bootstrap).
• Особое именование классов для избежания переопределения пользовательских классов.
• Javascript компоненты без jQuery (но с возможностью его использования, если он подключен).

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

Осторожно! Трафик.

Я — веб-разработчик с непрофильным образованием и ~10-летним стажем. Я делал для веба все, что только могло прийти в голову моим заказчикам и, иногда, начальству. Я люблю эту работу. Но все же есть несколько вещей, которые я делаю совсем не улыбаясь. Одна из них — это file uploader. From the very beginning — когда еще никому не приходило в голову делать его аяксовым — и до настоящего времени — когда он ресайзит картинки, загружает файлы в несколько потоков и многое-многое другое — он остается для меня одной из самых нелюбимых задач. Вроде как у меня получилось с этим справиться. Если интересно — добро пожаловать под кат.
Вас ждут немножко Coffeescript-а, совсем чуть-чуть жалоб на jQuery, краткое описание $.Deferred, один к месту и не к месту нечаянно примененный паттерн и отсылка к одной забавной и интересной книге.

Всем привет!
В предыдущей главе мы познакомились с основами бибилиотекиThree.js. Увидели несколько примеров и создали свою первую полноценную Three.js сцену. В этой главе мы немного глубже углубимся в эту библиотеку и попробуем более подробно объяснить основные компоненты, составляющие Three.js сцену. В этой главе вы узнаете о следующем:

1. какие компоненты используются в Three.js сцене
2. что можно делать с объектом THREE.Scene()
3. какая разница между ортогональной и перспективной камерами

Начнем мы с того, что посмотрим, как же можно создать сцену и добавить на нее объекты.

Начиная с версии 1.5, в Firefox появился механизм кеширования, сохраняющий состояние страницы в памяти. Кеширование действует на одну сессию браузера. Перемещаясь по посещенным страницам с использованием кнопок «Назад/Вперёд», нет необходимости загружать страницу с сервера целиком. При этом вся страница, включая js-скрипты, как бы «консервируются» в том состоянии, в котором они были, когда пользователь их покидал. Данный механизм позволяет производить навигацию по посещенным страницам крайне быстро. Состояние кеша остается неизменным, пока действует сессия браузера (пока пользователь не закроет закладку, или браузер).

Не «баг», а «фича»

Помимо прочего, непонимание данного механизма браузеров вызывает настоящую головную боль у разработчиков. Рассмотрим пример.
Есть форма, данные которой мы хотим отправить на сервер. Мы хотим как-то визуализировать этот процесс и запускаем спиннер при отправке формы. Браузер переходит на следующую страницу. Если мы вернемся назад, используя кнопку браузера «Назад» (или через window.history.back()), то скорее всего увидим, что спиннер так и вращается, хотя на самом деле уже ничего не происходит.

Разработчик может посчитать, что данное поведение ни что иное как баг браузера или какая-то его особенность, и в поисках быстрого решения бездумно вставить лишний обработчик на событие unload (первый пункт в списке, приведенном дальше). Тем самым разработчик отказывается от BFCache вообще, тем самым лишая своих пользователей возможности практически мгновенного перемещения по посещенным страницам.

Наткнулся в интернете на очередную игру для программистов.
На этот раз объектом издевательств стали регулярные выражения — авторы сделали Regex Crossword, где вместо вопросов — набор регулярных выражений.

Как разработчик, вы возможно в курсе о Google Hosted Libraries. Google предоставляет простой и быстрый способ, как включить в ваши веб-сайты 12 самых популярных JavaScript-библиотек.

Но что, если вы – вебмастер и хотите использовать преимущество быстрых CDN при использовании в других менее популярных проектах? Или же вы – разработчик и хотите сделать ваш проект более удобным в использовании и более доступным другим пользователям.

Здесь в игру вступает jsDelivr. jsDelivr – это бесплатная и свободная CDN, созданная для того, чтобы помочь разработчикам и вебмастерам. В ней нет ограничений по популярности и разрешены все типы файлов, включая библиотеки JavaScript, плагины jQuery, CSS-фрэймворки, шрифты и многое другое.

Привет, Хабра!
Эта статья является продолжением прошлой статьи (JavaScript to APK. http://habrahabr.ru/company/ifree/blog/214531/). Я попробую дать несколько советов по разработке мобильных сайтов, которые сложились из моего опыта работы над сервисами и продуктами в i-Free.


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

• Кнопочные, без поддержки touch-событий
• С сенсорным экраном, с поддержкой touch-событий
• Смартфоны

Откуда в 2014 году берутся старые кнопочные телефоны?

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

Откуда в 2014 году берутся новые кнопочные телефоны?

Производство новых J2ME телефонов заполняет низший сегмент рынка. Такие телефоны имеют несколько качественных отличий:

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

Кто делает сайты для таких телефонов?

Как правило, это очень крупные компании, которые стараются сделать свои сервисы максимально доступными (например, Google, Yandex, Mail). Цена вопроса в этом случае не имеет значения. Кроме того, во всех телефонах есть стандартные закладки, в которых вшит сайт оператора, производителя или компании вендора. На таких сайтах можно купить различный контент (игры, картинки, мелодии) или оформить какие-либо услуги. Т.к. телефонов производится очень много, то у таких сайтов может быть очень большая нагрузка.

Продолжаю серию (раз, два, три, четыре) постов по реактивному фуллстек javascript фреймворку derbyjs. На этот раз речь зайдет о компонентах (некий аналог директив в ангуляре) — отличному способу иерархического построения интерфеса, и разбиения приложения на модули.