В данном посте я хочу описать простую методику пиксельного искажения изображения на «чистом» javascript в 2D-Canvas без использования специальных библиотек и шейдеров, путём прямого доступа к пикселям изображения. Надеюсь, это будет интересно и полезно как для общего развития, так и для решения каких-то задач.

Доброго времени суток!

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

Вместо введения

Добрый день, Хабралюди.
Хотел бы поделиться со всеми моим скромным опытом выбора языка программирования для своих проектов. Сразу хочу подчеркнуть – я выбирал язык исходя из собственных нужд, и, вполне вероятно, что ваш выбор в аналогичных условиях может быть другим. Все же я искренне надеюсь, что эта статья будет полезной, так как в ней достаточно подробно и аргументировано проводится сравнение D с C++ и C#, а так же упоминаются свыше десяти различных языков, принадлежащих к различным классам и реализующих различные парадигмы. Сам D разрабатывается как высокоуровневый язык для системного и прикладного программирования.

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

Эти 70 шаблонов проиллюстрированы сотнями примеров приложений для операционных систем Apple, BlackBerry, Android, Symbian, Windows и WebOS будут изданы O’Reilly Media как «Mobile Design Pattern Gallery». Ниже приведена одна из моих любимых глав — Приглашение.

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

Вдохновившись статьёй Привет из свободного от libc мира, я так же решил проделать нечто подобное. Чтобы не заниматься этим бесцельно, я решил поставить перед собой следующую задачу. Сделать программу, выводящую какую-нибудь простую строку, вроде «ELF, hello!». Разобраться с тем, как именно она будет представлена в исполняемом файле. Ну и попутно, постараться уложиться в 100 байт.

Эта история берет начало в далеком 2006-м году… Я тогда был в начале своей программистской карьеры и работал в одной говноконторе развивающейся ноунейм фирме. Тогда у нас было несколько заказов на сайты с похожим функционалом: нужно было сделать портал, на который люди могли бы заливать видео/картинки/музыку и потом этот контент просматривать, комментировать, а заодно и смотреть рекламу принося прибыль доброму дяде владельцу. Все бы хорошо, но чтобы завлечь людей на сайт нужно чтобы там уже было много контента. Таким образом создавалось бы впечатление что сайт работает давно и успешно. И вот заказчик ставит грандиозную цель: наполнить новоиспеченный портал видео с youtube.com. Еще не зная, что меня ждет, я с радостью взялся за работу…

Меня просто бесит, когда менеджер проекта отправляет макет дизайна — письмом, с припиской «Вот, нарисовали. Смотрите. Ждем ваших замечаний». Убил бы.

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

— Это возмутительно! И вот почему:

Привожу перевод статьи Ника Карсона. В статье собраны вместе, как мне кажется, основные правила построения интерфейса для iOS приложений.

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

2. Ориентируйтесь на устройство при создании приложений: учтите не только размер экрана, но и где и когда устройство используется. Больше всего iPad используется для развлечений между 8-11 часами вечера, перед сном, тогда как iPhone — в очереди на автобус или в кофейне. Учтите различные сценарии использования при разработке приложений – включая и то, как далеко устройство расположено от лица пользователя.

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

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

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

За остальными 45-ю — добро пожаловать подкат.

Предисловие

Давно хотел написать. Мысли есть, желание есть, времени нету… Но вот нашлось, так что привет, Хабра.
Здесь я собрал все идеи, которые помогали и помогают в разработке веб-приложений. Для удобства я разбил их на группы:

1. Память
2. Оптимизация операций
3. Выделение критических участков
4. Циклы и объектные свойства
5. Немножко о DOM
6. DocumentFragment как промежуточный буфер
7. О преобразованиях в объекты
8. Разбитие кода
9. События перетаскивания
10. Другие советы

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

Память

Хоть это и не должно волновать клиентского программиста, но не забываем, что память всё-таки не бесконечна и когда-нибудь может закончиться, например, когда запущено несколько массивных программ: офис, графический редактор, компиляция большой программы и др. Несмотря на то, что приведенный пример тривиален, у меня действительно такое случилось, хоть и не из-за браузера, но он тоже сыграл свою роль: 1,3 Гб оперативы (отладчик, около 30 вкладок), начались тормоза по перегрузке страниц ОП в файл подкачки.
Чтобы уменьшить расход памяти, я предлагаю несколько способов:

Пост тем, кто хочет немножко отвлечься от работы и поразвлекаться с умом.

Сегодня наткнулся на интересный проект: contextfree

Все помнят курс теории компиляторов с университета? contextfree — генератор изображений на основе контекстно-свободных грамматик. Терминалами выступают простые графические примитивы (CIRCLE, SQUARE, TRIANGLE и т.д.). Нетерминалы задаем мы. Правила вывода могут включать в себя так называемые преобразования (повернуть, отразить, сдвинуть, поменять цвет). На основе этой простой модели можно получать очень интересные вещи… буквально несколькими строчками кода.

Начнем с простого примера:
startshape JustASquare //Начальный символ грамматики

background { b -1 } //Здесь мы задаем фон. b -1 - означает преобразование
//По умолчанию фон белый (brightness = 1), мы изменяем brightness до 0.

rule JustASquare { // Здесь мы задаем простое правило.
SQUARE { b 1 r 45 } // Белый квадрат, повернутый на 45 градусов.
}



Эта картина сгенерирована программой Context Free по следующему описанию:

startshape T
// FLIGIZ
background{b -1}
tile {s 2.5}
rule T {3*{r 120 hue 30}S{x .3}}
rule S 3{CIRCLE{hue 30}4*{r 20 b.007 sat .1}S[s.3.7y.9]}
rule S {CIRCLE{hue 15}9*{r 20 b.05 hue -3}S[s.3.7y.9]}
rule S {S{flip 90}}

Здравствуй, хабр. Вчера я игрался с новой Ubuntu 11.10 и совершенно случайно наткнулся на такое замечательное приложение, как Structure Synth. Structure Synth уже обсуждался на хабре, а я бы хотел набросать вольно-литературный перевод краткого туториала с официального сайта.

Многие любят Gentoo за ее универсальность. Используя портежи, можно сделать инструмент под любые задачи. И пускай вас не смущает то, что секретарь никогда не будет компилировать Firefox — Боже упаси ей дать возможность ставить софт! Что может быть лучше дистрибутива, установив который вам больше ничего не понадобится с ним делать! Представьте себе — 5-10 минут времени и вы получаете систему с необходимым набором софта, собранного, настроенного и оптимизированного по вашим предпочтениям.