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

Как обычно, в конце статьи ссылки на демонстрационную игру и исходный код на гитхабе.

Содержание:

• Поддержка вебсокетов браузерами
• Разработка онлайн-игры
• Благодарности
• Демка и исходный код

Буквально недавно стало известно, что Firefox 6 получит SSE (уже есть в Opera 10.6+, Chrome, WebKit 5+, iOS Safari 4+, Opera Mobile 10+) так, что поддержка более половины всех браузеров (охват аудитории пользователей) уже не за горами. Настало время присмотреться к этой технологии. SSE предложил Ian Hickson более 7 лет назад, но только год назад она стала появляться в браузерах. У нас же есть WebSockets зачем нам ещё один какой-то протокол?! Но во всем есть свои плюсы и минусы, давайте посмотрим чем же SSE может быть полезен.

Идея SSE проста — клиент подписывается на события сервера и как только происходит событие — клиент сразу же получает уведомление и некоторые данные, связанные с этим событием. Чтобы понять полезность протокола SSE необходимо сравнить его с привычными методами получения событий, вкратце объясню их суть:

Некоторое время назад я выбирал библиотеку для работы с вебсокетами. На просторах интернета я натыкался на статьи по интеграции node.js с yii, а почти все статьи о вебсокетах на хабре ограничивались инструкциями к тому, как использовать phpdaemon.

Я изучал библиотеки phpdaemon и ratchet, они достаточно монструозны (причём используя ratchet для отправки сообщения конкретному пользователю рекомендовано дополнительно использовать wamp). Мне не совсем было понятно для чего использовать таких монстров, которые требуют установку других монстров. Почитав исходники этих, а также других библиотек, я разобрался как всё устроено и мне захотелось написать простой вебсокет-сервер на php самостоятельно. Это помогло мне закрепить изученный материал и наткнуться на некоторые подводные камни, о которых я не имел представления.

Так я решил написать необходимый для меня функционал с нуля.

Получившийся код и ссылка на демонстрационный чат в конце статьи.

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

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

С момента перехода с PHP 4.4 на PHP 5.3 в Badoo прошло уже 4 года, пришла пора обновлять PHP, на этот раз сразу на версию PHP 5.5. Помимо новых фич, новая версия PHP в очередной раз принесла нам существенное увеличение производительности, поэтому у нас было много причин для апгрейда. В этой статье мы расскажем о том, как мы переходили на PHP 5.5, какие «грабли» собрали, и зачем в очередной раз переписывали нашу систему для запуска юнит-тестов на основе PHPUnit.


Рис 1. Общая архитектура

«Грабли» при переходе с PHP 5.3 на PHP 5.5

В прошлый раз мы переходили с четвертой версии PHP на пятую, причём наша версия PHP 5.3 содержала патчи, чтобы работал «старый» синтаксис PHP, например, $a = &new ClassName();, и чтобы наша кодовая база могла работать на PHP4 и PHP5 одновременно. На этот раз у нас таких ограничений не было, поэтому при переходе мы просто нашли и заменили все устаревшие конструкции на более актуальные, и на этом переписывание кода было закончено.

Основные проблемы, которые у нас возникли:

• часть deprecated-фич языка была убрана;
• расширение mysql стало deprecated;
• низкая производительность расширения runkit, которое мы используем при написании юнит-тестов.

После перехода на PHP 5.5 наши юнит-тесты начали проходить значительно дольше (в несколько раз), поэтому мы решили в очередной раз доработать нашу «пускалку», чтобы решить эту проблему.

Есть замечательный сайт http://todomvc.com/, на котором демонстрируется решение одной и той же задачи с помощью разных JavaScript MV* (Model-View-[Controller]) фреймворков. Сейчас там представлены десятки различных фреймворков, у каждого из которых есть свои преимущества и недостатки. Есть там и такие гиганты, как Angular, Ember и Backbone. Несмотря на высокую конкуренцию, я все равно хотел бы продемонстрировать свой MV* фреймворк — jWidget.

Я быстро просмотрел все решения, представленные на сайте TodoMVC, и не нашел ни одного фреймворка, похожего на jWidget. Дело в том, что, помимо JavaScript, я много программирую на объектно-ориентированных языках программирования, таких как Java, C#, а в прошлом и на C++. Поэтому я большой фанат объектно-ориентированного программирования, SOLID принципов и паттернов объектно-ориентированного проектирования. Мне не нужен фреймворк, который стеснял бы меня в возможности применения стандартных объектно-ориентированных решений. То, что я увидел в существующих решениях TodoMVC, не внушает доверия в этом отношении. Как правило, они предоставляют некий декларативный синтаксис и мощный шаблонный движок, но объектно-ориентированная основа всего этого, даже если она существует, скрыта от наших глаз.

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

В этом посте вы узнаете о новой фиче Marionette.js — Behaviors.

Очень часто в различных элементах интерфейса у нас встречаются похожие элементы управления (например кнопка «Удалить» может быть и у категорий, и у записей, и в списке зарегистрированных пользователей… да везде), и каждый раз приходится описывать обработчик этой кнопки в каждом View, причем везде одинаково.
Но это уже называется дублирование кода, и не приветствуется в большинстве общества. Поэтому разработчики Marionette.js предоставили нам такую замечательную фичу как Behaviors.

Behaviors предоставляет интерфейс для изолирования описаний взаимодействия DOM с пользователем в отдельные логические куски кода. Behavior может быть применено к любому View любое количество раз.

В этой статье рассмотрим самый тривиальный пример — кнопка «Удалить».

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

---

Привет Хабр!

По мотивам вот этой статьи

Как веб-разработчик, выбравший Mac OS X в качестве основного рабочего инструмента, я столкнулся с проблемой настройки необходимого окружения. По многолетней привычке работы с серверами на Linux, руки сами потянулись в консоль дабы все поставить, но остановились — постойте, постойте, но зачем мне превращать эту операционку в очередной Linux сервер? Мне этого шаманства с консолью на серверах хватает, спасибо. Будем использовать встроенные компоненты, насколько это возможно.

Яндекс.Карты – это высоконагруженный картографический портал, который работает с огромными объемами данных. В своей лекции Владимир Зайцев рассказывает старшеклассникам – студентам Малого ШАДа – о том, как создавать и поддерживать такие ресурсы, и о технологиях, которые для этого используются. А также на примерах объясняет, какие можно разрабатывать инструменты и проводить исследования на базе полученных данных.



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

• Спутниковые снимки и карта
• Народная карта
• Поиск
• Пробки
• Маршрутизатор и навигация
• Панорамы
• API

Привет, Хабр. В этой статье я расскажу о HTML Notification API.

Какие возможности предоставляет Notification API

API позволяем отправлять уведомления через браузер. Вы можете задавать иконку для каждого уведомления, группировать уведомления, указывать заголовок и текст уведомления.

Поддержка в браузерах

• Safari 6
• Chrome 27
• Firefox 22

Opera 15 beta не работает с Notifications API, несмотря на наличие конструктора Notification.
На мобильных платформах технология не работает.
В движке webkit есть старая нотация в виде webkitNotifications.

Как это работает

Цикл работы следующий:

1. Получить разрешение на отправку;
2. Правило фиксируется для сайта;
3. Отправить уведомление.

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

• Секреты управления программистами
• Как стать менеджером в IT
• Черная книга менеджера
• Белая книжная полка менеджера
• Управленческие инструменты

Получить все книги бесплатно (нужна регистрация) можно вот здесь:

5 управленческих книг Стратоплана >>

Чуть ниже — об истории создания всех этих книг

AngularJS создан для тех разработчиков, которые считают, что декларативный стиль лучше подходит для создания UI, а императивный — для написания бизнес-логики.

Дзен Angular

• Хорошо отделять манипуляцию DOM-ом от логики работы приложения. Это существенно улучшает тестируемость кода.
• Хорошо считать, что автоматизированное тестирование приложения настолько же важно, насколько и написание самого приложения. Тестируемость очень сильно зависит от того, как структурирован код.
• Хорошо отделять разработку клиентской части от серверной. Это позволяет вести разработку параллельно и улучшает повторное использование на обеих сторонах.
• Хорошо, когда фреймворк ведет разработчика по всему циклу разработки приложения: от проектирования UI через написание бизнес-логики к тестированию.
• Хорошо, когда распространенные задачи становятся тривиальными, а сложные — упрощаются.

AngularJS представляет собой комплексный фреймворк. В стандартной поставке он предоставляет следующие возможности:

• Все, что вам нужно для создания CRUD-приложений: data-binding, базовые директивы для шаблонов, валидация форм, роутинг, deep linking, повторное использование компонентов, dependency injection, инструменты для взаимодействия с серверными (RESTful) источниками данных.
• Все, что вам нужно для тестирования: средства для модульного тестирование, end-to-end тестирования, mock-и.
• Шаблон типового приложения, включающего в себя структуру каталогов и тестовые скрипты.

AngularJS разрабатывается сотрудниками Google и используется, как минимум, в одном сервисе Google — DoubleClick.

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

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

Сейчас довольно популярно использование Comet-технологии, «когда при которой постоянное HTTP-соединение позволяет веб-серверу отправлять (push) данные браузеру, без дополнительного запроса со стороны браузера», согласно википедии.
Реализаций этой технологии есть много разных, но я сейчас хочу остановиться на одной из них, которая называется Long Polling. В статье я разберу, что это такое и с чем его едят.
Ну а тем, кто знает, что это, возможно, будетинтересно посмотреть на реализацию, которая не использует сторонний софт для своей работы — только PHP. Зачем это нужно, если есть специальные comet-сервера, которые выдержат гораздо более высокие нагрузки, чем скрипт на PHP? Это может пригодиться, если нужно сделать небольшой проект без высоких нагрузок, а на хостинге не дают ставить сторонний софт. Ну и если мне в рамках одного задания, где как раз нельзя было использовать сторонние приложения, пришлось реализовать данный функционал, то почему бы не поделиться.

В тот момент, когда начиналась разработка HTML Academy, мы достаточно серьёзно играли в WOW, да и, вообще, были поклонниками игр Blizzard со стажем. Поэтому с игровыми механиками были знакомы достаточно хорошо, хотя сами этого не подозревали. Многие интересные механизмы появились в академии, как нам казалось, сами по себе. Но позже выяснилось, что на самом деле они называются «игровыми механиками», а мы их неосознанно взяли из игровой практики.

Ratchet — так называется HTML5-фреймворк для быстрого прототипирования мобильных приложений, который 1,5 года назад создали те же парни, которые когда-то выпустили Bootstrap.

Инструмент позволяет быстро создать красивый интерфейс мобильного приложения — и дает вам красивые стили и замечательные иконки, согласованные с гайдлайном в зависимости от платформы. Можно сделать прототип, а можно завернуть в PhoneGap и без особых усилий получить сравнимый с нативным интерфейс приложения в продакшене.
Фреймворк очень прост в использовании и прекрасно документирован.

Я являюсь поклонником Ratchet с момента выхода первой версии. Тогда он был доступен только под iOS.
Не так давно вышла вторая версия, которая наряду с iOS поддерживает Android. Ура-ура!
(правда, обратной совместимости с первой версией нет)

Кому интересно про новые возможности Ratchet 2.0 — прошу под кат!

Эта статья посвящена разработке стильных, модных и молодежных HTML5 приложений с помощью нового фреймворка Phaser. В ней описан процесс установки библиотеки и создание классической игры Pong.

Введение

Phaser — это движок для разработки мобильных и десктопных HTML5 игр, базирующийся на библиотеке PIXI.js. Поддерживает рендеринг в Canvas и WebGL, анимированные спрайты, частицы, аудио, разные способы ввода и физику объектов. Исходники доступны как для просмотра, так и для свободной модификации. Он создан Ричардом Дейви (Richard Davey), известному благодаря активному участию в сообществе программистов, использующих Flixel framework. Ричард не скрывает, что вдохновлялся Фликселем, поэтому некоторые вещи в Фазере будут знакомы опытным флешерам. Первая версия нового движка вышла 13 сентября этого года, сейчас ведется не только активное развитие библиотеки, но и написание документации, поэтому в данный момент уроков по ней, мягко говоря, немного. Что, по моему скромному мнению, следует исправлять, и прямо сейчас.

Всем привет!

Друзья, не мне вам рассказывать, да и сами вы знаете о том, как делается backend для серверных/клиент-серверных приложений. В нашем идеальном мире всё начинается с проектирования архитектуры, затем выбираем площадку, затем прикидываем нужное количество машин, как виртуальных, так и нет. Затем происходит сам процесс поднятия архитектуры для разработки/тестирования. Всё готово? Ну поехали писать код, делать первый коммит, обновлять код на сервере из репозитория. Открыли консоль/браузер проверили и поехало. Пока всё просто, а что дальше?