Клиентская оптимизация → Увеличиваем скорость загрузки сайта используя lazy-load изображений
Сейчас многие сайты насыщены графикой в разных видах: аватары, иллюстрации к постам, галереи и тп.
Читатели блога «Клиентская оптимизация» как никто другой знают цену лишних запросов к серверу.
Количество обращений к серверу можно легко уменьшить с помощью техники пост загрузки изображений, которые не попадают в область видимости(первый экран). Т.е изначально будут загружаться только те изображения которые пользователь способен увидеть, остальные будут загружаться по мере скролинга страницы.
Читатели блога «Клиентская оптимизация» как никто другой знают цену лишних запросов к серверу.
Количество обращений к серверу можно легко уменьшить с помощью техники пост загрузки изображений, которые не попадают в область видимости(первый экран). Т.е изначально будут загружаться только те изображения которые пользователь способен увидеть, остальные будут загружаться по мере скролинга страницы.
Web-разработка → Download Master Plugin ломает Prototype-сайты
С недавнего времени у меня на Клавогонках у некоторых пользователей начались проблемы совершенно мистического плана — не работали функции, которые ну никак не могли не работать, всплывали абсолютно дикого вида ошибки и гейзенбаги. Долго и мучительно пытаясь выяснить в чем проблема, и не без помощи сообразительных юзеров я обнаружил, что последняя версия Download Master (довольно популярная программа), выпущенная вроде бы где-то в ноябре, содержит удивительнейший Firefox-плагин, который ставится в браузер автоматически. Плагин этот зовется Download Master Plugin 1.2 и его удивительность заключается в том, что он подгружает в глобальное javascript-пространство страницы библиотеку jQuery целиком как она есть. По-настоящему подгружает, со всеми функциями, и (внимание!) с функцией $(). Тем самым, разумеется, ломая аналогичную функцию из Прототайпа.
JavaScript → Виджет выбора OpenID провайдера на Prototype
Когда-то я уже писал, как интегрировать OpenID авторизацию в ваш сайт. Речь шла о серверной части.
Сейчас же я говорю о UI части — виджет для выбора провайдера.
В качестве клиентской библиотеки для своего проекта я выбрал prototype и первым делом я полез в гугл поискать готовое решение. Удалось найти такое, но только для JQuery — code.google.com/p/openid-selector/
И так мне ничего не оставалось как написать OpenID selector самому. Вот что получилось

Сейчас же я говорю о UI части — виджет для выбора провайдера.
В качестве клиентской библиотеки для своего проекта я выбрал prototype и первым делом я полез в гугл поискать готовое решение. Удалось найти такое, но только для JQuery — code.google.com/p/openid-selector/
И так мне ничего не оставалось как написать OpenID selector самому. Вот что получилось

Блог им. saks → Как «честно» симулировать события
Здравствуй уважаемое хабрасообщество.
Не так давно я начал заморачиваться не только тестированием кода на ruby, но и js, которого становиться слишком много в проектах. Со
временем добрался и до IU на js, а для его тестирования понадобилось симулировать всяко-разные события. Поискав, нашёл в одной из библиотек на jquery решение. В расширениях для тестирования была искомая библиотечка для симуляции событий. Но вот незадача, мы используем prototype (я закоренелый рубист и оно мне нравиться), а не jquery.
Немного поразмыслив я решил подправить сие, для использования, как plugin к prototype. Что из этого получилось? Что ж, мне очень помогло в тестах. Если Вы тоже сторонник тестируемого кода — Вам тоже будет полезно.
В использовании выглядит это примерно вот так:
Я намеренно расширял Element, а не Event — мне так кажется логичнее, хотя это можно и обсудить. Сжатая версия весит 3K, с документацией 7K. Git
Для почитателей jquery — выше ссылка.
Не так давно я начал заморачиваться не только тестированием кода на ruby, но и js, которого становиться слишком много в проектах. Со
временем добрался и до IU на js, а для его тестирования понадобилось симулировать всяко-разные события. Поискав, нашёл в одной из библиотек на jquery решение. В расширениях для тестирования была искомая библиотечка для симуляции событий. Но вот незадача, мы используем prototype (я закоренелый рубист и оно мне нравиться), а не jquery.
Немного поразмыслив я решил подправить сие, для использования, как plugin к prototype. Что из этого получилось? Что ж, мне очень помогло в тестах. Если Вы тоже сторонник тестируемого кода — Вам тоже будет полезно.
В использовании выглядит это примерно вот так:
$('foo').simulate('keypress', Event.KEY_RETURN);
$('foo').simulate("drag", {
dx: 10,
dy: 0,
onComplete: function(element){
alert('drag simulation $(' + element.id + ')');
}
});Я намеренно расширял Element, а не Event — мне так кажется логичнее, хотя это можно и обсудить. Сжатая версия весит 3K, с документацией 7K. Git
Для почитателей jquery — выше ссылка.
Блог им. AndryX → Проектирование информационных систем в Visual Paradigm
Данная статья подготовлена в качестве доклада небольшой группой студентов НТУУ «КПИ». Являясь её соавтором я решил выложить текстовую копию на хабр, может кому пригодиться. В ней рассказано о проектировке крупных информационных систем при помощи Visual Paradigm. Букв много и написано на ооочень начальном уровне, потому имевшим с этим дело можно не читать.
JavaScript → Сравнение скорости популярных JS библиотек
Встал задача, выбрать JS библиотеку для нового проекта. Я уже работал с Prototype и JQuery, в разных проектах и выбирал в основном из них. Обе библиотеки имеют свои слабые и сильные стороны. Холивар на данную тему можно развивать до бесконечности, но меня в первую очередь интересует скорость.
Благодаря приложению пользователя lusever, я провел тест производительности. В тесте так же участвовала не без известная библиотека Ext JS. Тестируется скорость выборки DOM элементов по селекторам, можно зайти на сайт и попробовать пройти тест самостоятельно, кстати, там есть очень интересные примеры селекторов, о которых я ранее не знал.
Благодаря приложению пользователя lusever, я провел тест производительности. В тесте так же участвовала не без известная библиотека Ext JS. Тестируется скорость выборки DOM элементов по селекторам, можно зайти на сайт и попробовать пройти тест самостоятельно, кстати, там есть очень интересные примеры селекторов, о которых я ранее не знал.
Блог им. phomin → HDRA. Interactive Mixer Prototype — Next Gen Game Audio Tool
Andrew Quinn в среде max/msp создал прототип интерактивного микшера. Дакинг, снэпшоты микшера, импорт VST-эффектов, для них же insert и return, изменение параметров эффектов в зависимости от игрового параметра (контроллера) и даже зарождается управление по миди. Работает это всё вот как: задаются настройки микшера для игровых ситуаций. Например, в зависимости от насыщенности происходящего:
1. Сто игроков на самолётах под грайндкор бомбят городишко с миллионом мобов.
2. Один немой сферический моб в позе лотоса думает о вечном в вакууме.
3. Промежуточные варианты.
Можно использовать не только в зависимости от насыщенности происходящего. Например, удобно переключать режимы камеры в симуляторе и применять различные параметры дакинга, громкости групп звуков, добавлять эффекты и изменять их параметры относительно вида на машину или из кабины/кокпита. Индур/аутдур и т.д.
Для перехода из одного состояния микшера (снэпшота) в другое реализована интерполяция с настройками кривой и задержки.
Так же реализована система выбора текущего снэпшота микшера по приоритету, на случай, если вызывается больше одного снэпшота.
И всё это с удобным и понятным саунд-дизайнеру интерфейсом.

сайт проекта
скачать InteractiveMixer
документация
1. Сто игроков на самолётах под грайндкор бомбят городишко с миллионом мобов.
2. Один немой сферический моб в позе лотоса думает о вечном в вакууме.
3. Промежуточные варианты.
Можно использовать не только в зависимости от насыщенности происходящего. Например, удобно переключать режимы камеры в симуляторе и применять различные параметры дакинга, громкости групп звуков, добавлять эффекты и изменять их параметры относительно вида на машину или из кабины/кокпита. Индур/аутдур и т.д.
Для перехода из одного состояния микшера (снэпшота) в другое реализована интерполяция с настройками кривой и задержки.
Так же реализована система выбора текущего снэпшота микшера по приоритету, на случай, если вызывается больше одного снэпшота.
И всё это с удобным и понятным саунд-дизайнеру интерфейсом.

сайт проекта
скачать InteractiveMixer
документация
JavaScript → Javascript Framework Matrix
Javascript Framework Matrix предоставляет краткий обзор функции всех популярных JS Фраемворокв (jQuery, MooTools, The Dojo Toolkit, Prototype, script.aculo.us, Ext.JS, Adobe Spry, BBC Glow, Yahoo UI! Library). Выбор фраемворка зависит от многих факторов. Matrix демонстрирует разницу в стиле API и функциональности JS библиотек. По ссылке множество примеров и сниппетов с ссылками на официальную документацию
JavaScript → Тонкости ECMA-262-3. Часть 7. ООП
В данной статье мы рассмотрим ключевые моменты, касающиеся объектно-ориентированного программирования в ECMAscript. Чтобы данный материал не получился "очередным" (ведь подобная тема поднималась уже не раз в различных статьях), больше внимания будет уделено, опять же, теоретическим аспектам.
Если у вас возникнут какие-либо вопросы или дополнения, их, как всегда, можно обсудить в комментариях.
Если у вас возникнут какие-либо вопросы или дополнения, их, как всегда, можно обсудить в комментариях.
JavaScript → Prototype 1.6.1: быстрее, чище, команднее
Поздравляем Эндрю Дюпона (Andrew Dupont) и Тоби Ланжеля (Tobie Langel) (нового официального соведущего ядра Prototype) с выходом нового 1.6.1:
Вот несколько симпатичных изменений. Хотя с неподдельным волнением ожидаю увидеть работу нового Prototype 2.0 и как команда перезагрузит Prototype.
- Полная совместимость с новыми браузерами. Эта версия Prototype полностью поддерживает 1.0 и более крупные версии Google Chrome, и Internet Explorer 8 как в режиме совместимости, так и в суперстандартном.
- Сохранение метаданных в элементах. С лёгкостью объединяйте джаваскриптовые пары ключей и значений с элементами DOM. Поглядите блогозапись, с которой это началось.
- Новые события мыши. Собственнические события Internet Explorer — «mouseenter» и «mouseleave» — теперь доступны для всех браузеров.
- Улучшенное быстродействие и домовитость. Часто использовавшиеся методы Function#bind, String#escapeHTML и Element#down стали быстрее, и Prototype лучше прибирает за собою.
- Собрано со Sprockets. Теперь вы можете включать репозиторий исходного кода Prototype в своё приложение и использовать Sprockets для управления зависимостями и для распространения.
- Внутреннее документирование посредством PDoc. Наша документация по API теперь хранится внутри исходного кода посредством PDoc, так что проще посылать патчи или лицезреть документацию по конкретной версии.
Вот несколько симпатичных изменений. Хотя с неподдельным волнением ожидаю увидеть работу нового Prototype 2.0 и как команда перезагрузит Prototype.