1. Верстка, аутсорсинг и технические задания

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

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

Проблема

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

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

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

Не так давно из лекции Дугласа Крокфорда я узнал об очень интересной технике «шаблонизирования» в JavaScript. Основная цель техники заключается в том, что мы получаем с сервера JSON и потом как-то формируем из этого HTML. Во многих ситуациях этот процесс оставляет желать лучшего потому, что формирование HTML происходит или с помощью конкатенации строк или ряда операций createElement, appendChild и т.п. Возможно многие уже знают об этом решении, но для тех кто не знал надеюсь будет полезно.

Какое-то время работал с организацией системы обучения на основе ВКС Tandberg. Когда была поставлена задача организации удаленного обучения, Open Source решения были просты и унылы. Конторе пришлось изрядно потратится. Но Open Source не стоит на месте, все больше и больше компаний выходят на рынок с новыми идеями и большинство из них бесплатны для простого обывателя.

Введение

ZendX_Console_Process_Unix позволяет разработчикам создавать объекты под видом процессов, и таким образом параллельно выполнять несколько задач. Из-за особенностей реализации на текущий момент эта возможность доступна только на *nix системах, таких как Linux, Solaris, Mac / OSX и другие в CLI или CGI режиме. Кроме того для работы этого компонента необходимы следующие модули: Shared Memory, Process Control и POSIX. Если одно из требований не выполняется, то будет брошено исключение.

Основы использования ZendX_Console_Process_Unix

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

Метод _run(), а так же каждый метод вызванный внутри него будет выполняться в отдельном процессе. Любой другой метод, вызванный в вашем приложении будет выполняться в родительском процессе.

Методы setVariable () и getVariable () могут быть использованы для передачи переменных между родительским и дочерними процессами. Для наблюдения за статусом дочернего процесса следует вызывать внутри него метод _setAlive () через короткие промежутки времени, таким образом родительский процесс сможет получить информацию о состоянии дочернего процесса посредством вызова метода getLastAlive (). Чтобы получить PID дочернего процесса, родитель может вызвать getPid().

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

Диаграмма Ганта (англ. Gantt chart, также ленточная диаграмма, график Ганта) — это популярный тип столбчатых диаграмм, который используется для иллюстрации плана, графика работ по какому-либо проекту. Является одним из методов планирования проектов.

О визуализация графов в вебе говорили здесь, навеяно этой статьей.

Под катом обзор JavaScript библиотек для рисования графов, диаграмм и прочей красоты.

Буквально только что в топе проскочила замечательная статья "Элементы семантической паутины". Начал писать на нее ответ, но он получился слишком большим, поэтому выделяю его в отдельный топик.

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

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

Обратите внимание на вот эту иллюстрацию:



Красиво, правда?

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

Выбор темы

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

Для организации трансляции нам потребуется:

• Linux
• FFmpeg (включает в себя ffserver)

Теория

FFmpeg — это набор свободных библиотек с открытым исходным кодом, которые позволяют записывать, конвертировать и передавать цифровое аудио и видео в различных форматах. Он включает libavcodec, библиотеку кодирования и декодирования аудио и видео и libavformat, библиотеку мультиплексирования и демультиплексирования в медиаконтейнер. Название происходит от названия экспертной группы MPEG и «FF», означающего «fast forward».

© Wikipedia

ffserver идёт в комплекте с ffmpeg и выполняет роль медиа-сервера — получает видеопоток от ffmpeg, который может быть запущен на другой машине, и раздаёт его счастливым пользователям.
Каждый получаемый поток называется Feed’ом (далее будет просто фид). Таких потоков может быть несколько, так же как и отдаваемых (выходных).
FFmpeg у нас будет захватывать видео с веб-камеры или читать из файла.

Введение

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

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

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

Защита (или отсутствие защиты) от различных типов атак демонстрируется на примере протоколов популярных сегодня систем: Assist, Cyberplat, WebMoney, ChronoPay, Robokassa и PayPal (платёжные системы), а также OpenID, OpenAuth, OAuth (децентрализованная аутентификация).

Уважаемые читатели, в течение последних трех месяцев мы собирали материалы по семантическим технологиям. В результате мы создали SemanticFuture.Net для анализа применимости семантических технологий и средств, таких как Semantic MediaWiki, Virtuoso, OWL и Sparql, к русскоязычным ресурсам.

На страницах Semantic Future мы будем:
1) собирать актуальную информацию по современным семантическим технологиям и сервисам, по всему тому, что сейчас или в ближайшее время будет оказывать свое положительное влияние на развитие Веб;
2) делать презентацию наших трудов и достижений;
3) организовывать встречи и тематические мероприятия;
4) тестировать семантические программные продукты и подбирать для вас специалистов для внедрения семантик технологий в ваши системы и продукты.
Кто мы?
Мы это Semantic Web User Group (SWUG).

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

Многие задают мне один и тот же вопрос:
«Как дебажить этот $%*!%$! JavaScript?».

Так вот, во-первых JavaScript — не $%*!%$! А как я его дебажу — сейчас расскажу.

(Примечание: наверное эта статья больше для новичков. Так что не судите строго)

Знаете, фавикончики в ico это как-то прошлый век =) Давайте будем модными, современными и все такое. Короче, берем иконку в png (да-да, с прозрачностью и всеми делами), сохраняем в размере 16×16, на сайте (в блоке <head>, ага) подключаем так:

<link rel="icon" type="image/png" href="favicon.png" />

Особенно под впечатлением владельцы айфонов и точей, т.к. для них мы делаем красивую иконюшку размером 57×57 (можно кстати и больше, но это стандартный размер иконки на ланч-скрине), подключая ее так:

<link rel="apple-touch-icon" href="apple-touch-favicon.png"/>

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

UPD: Спасибо хабраюзеру NickyX3 за интересное уточнение:

Автор забыл указать, что иконда для springboard тачей и яблофонов будет в таком варианте закруглена по углам и на нее будет наложен блик автоматически самоим девайсом. Для избежания этого (совсем красивая кастом иконка) вместо apple-touch-icon следует написать apple-touch-icon-precomposed.

Введение

С момента написания мной предыдущей статьи по оптимизации этой связки прошло довольно много времени. Тот многострадальный Pentium 4 c 512Мб памяти, обслуживающий одновременно до тысячи человек на форуме и до 150,000 пиров на трекере уже давно покоится на какой-нить немецкой, свалке, а клуб сменил уже не один сервер. Всё сказанное в ней всё ещё остаётся актуальным, однако есть вещи которые стоит добавить.
Статья большая, так что будет поделена на логические блоки:

0. Зачем вообще что-то оптимизировать?
  
1. Оптимизация ОС (FreeBSD)
  1.1 Переход на 7.х 
  1.2 Переход на 7.2
  1.3 Переход на amd64
  1.4 Разгрузка сетевой подсистемы
  1.5 FreeBSD и большое кол-во файлов
  1.6 Softupdates, gjournal и mount options
  
2. Оптимизация фронтенда (nginx)
  2.1 Accept Filters
  2.2 Кеширование
  2.3 AIO
  
3. Оптимизация бэкенда
  3.1 APC
  3.1.1 APC locking
  3.1.2 APC hints
  3.1.3 APC fragmentation
  3.2 PHP 5.3
  
4. Оптимизация базы данных
  4.1 MySQL 
  4.1.1 Переход на 5.1
  4.1.2 Переход на InnoDB
  4.1.3 Встроеный кеш MySQL - Query Cache
  4.1.4 Индексы
  
4.2 PostgreSQL
  4.2.1 Индексы
  4.2.2 pgBouncer и другие.
  4.2.3 pgFouine
  
4.3 Разгрузка базы данных
  4.3.1 SphinxQL
  4.3.2 Не-RDBMS хранилище
  4.4 Кодировки
  4.5 Асинхронность
  
Приложение. Мелочи.
  1. SSHGuard или альтернатива.
  2. xtrabackup
  3. Перенос почты на другой хост
  4. Интеграция со сторонним ПО
  5. Мониторинг
  
 6. Минусы оптимизации

Что ж продолжим наши изыскания на предмет получения текста из различных форматов данных. Не так давно мы с вами научились вытаскивать текст из zipped-xml-based файлов (odt и docx), а также, в начале этой недели, из pdf. Сегодня мы продолжим с обещанным rtf.

Rich Text Format (он же rtf), вы могли бы подумать, достаточно забытый, хотя и не очень сложный формат представления текстовых данных. Что ж, относительно несложный для получения текста, но за свою историю: от своей первой версии до текущей 1.9.1 — он приобрёл под 300 страниц официально документации и огромное количество надстроек, которые в большей степени нам будут мешать при получении plain text'а. Попробуем их обойти…

Многим JavaScript-разработчикам приходилось сталкиваться с объектами, перечисленными в заголовке, например, при решении следующих задач:
— создание визуальных редакторов (wysiwyg),
— поиск в окне браузера,
— выставление BB-кода,
и т.д.

В этой статье автором предпринята попытка собрать перевод документации об этих объектах в одном месте + написать небольшие сопроводительные примеры. Перевод вольный, не дословный, так что если встретите неточность или корявую формулировку — пишите в комментариях.

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

Прочитав пост на хабре про онлайн чат для сайта через джаббер, мне стало интересно — а как оно работает и как такое можно сделать самому, без готовых приложений. В итоге у меня получилась очень простая заготовка «чата для сайта через джаббер». К сожалению у меня нет выделенного сервера с линуксом для тестов, поэтому был использован локальный компьютер с Win7 (и сервером Apache).

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

• Jabber сервер, можно публичный, можно локальный. Я выбрал Openfire и установил его локально. Сервер должен поддерживать Bosh — XEP-0124: Bidirectional-streams Over Synchronous HTTP, об этом чуть позже.
• JS библиотека, которая будет реализовывать джаббер-клиент на сайте. Я взял Strophe. Это достаточно низкоуровневая библиотека, в которой нет функций типа «ПослатьСообщение(Куда, Текст)». Для достижения нужных действий нужно вручную составлять команды джаббер серверу (в XML). Удобные средства для создания XML в Strophe есть :)