JavaScript *

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

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

 

Поиск по хабру похожей статьи не дал, потому рискну поделится с теми кто еще не в курсе
Многие из вас сталкивались с проблемой хранения данных на клиенте. Первым делом в голову приходит cookies но ограничение хранения данных в размере не более 4kb не всех радует, сегодня если позволите я вам расскажу как посредством Java Script хранить около 100kb на клиенте.

Эту статью я хочу посвятить тонкостям работы с массивами в JavaScript.

Наверное, у каждого JavaScript-разработчика есть фунции (самописные или библиотечные) $ (выбор элемента по id) и $$ (выбор элементов по CSS-классу). Если мы выбираем несколько элементов по CSS-классу, то мы хотим произвести с ними определенные действия. Напрашивается цикл. А если нужна выборка среди них? Преобразования? Действия над нужными элементами? Непростой получается код.

JavaScript не стоит на месте, Mozilla неустанно улучшает JavaSript в своем движке Gecko и грех не пользоваться этими нововведениями. В JavaScript 1.6 добавлены новые полезные методы для упрощения кода, необходимого в вышеописанных ситуациях.

В последнее время столкнулся с тем, что Prototype не такая уж клевая библиотека. Даже в компрессии напару с scriptaculous занимают много места да и синтаксис странный. Для меня загадка, почему в Rails включили именно его. jQuery по синтаксису намного больше похож на Ruby и более легковесная библиотека. Собственно немного порыскал и нашел неплохие шпаргалки на jQuery, чтоб освоение протекало несколько легче.

1. jQuery Color Cheatsheet (PNG)
   
   
   

Для начала я хочу поблагодарить m007, который подал идею, как можно упростить Programmer-friendly интерфейс взаимодействия Клиент(JS)-Сервер(PHP), что и поспособствовало написанию этой статьи.

Данная статья является заключительной, в которой я объединю JS-Шаблоны, PHP Model-controller, и добавлю Динамическое создание UI методов на JS (некоторые идеи которого были взяты из статьи m007). Тем самым мы получим на выходе неплохой и удобный фундамент для создания своих AJAX приложений.

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



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

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

При разработке модуля подключения апплетов к некой платформе (назовем ее Hyper) появилась задача обеспечения безопасности, так как подключаемый апплет кроме пассивного блока данных (content) содержит и активный (code). А в активном блоке невнимательный разработчик (злоумышленник) может обратиться к глобальному объекту window и получить доступ к переменным или важным методам ядра и сделать подмену, что в лучшем случае просто приведет к краху платформы (в пределах браузера конечно), а в худшем установка различных хуков не влияющих на работу системы, но перехватывающих персональные данные пользователя. В дальнейшем ничего не подозревающий пользователь будет пользоваться гаджетом «Часы от Боба», который по тихому собирает о нем информацию, или рассылает спам по адресам из контакт листа.

Откопал у Kevin van Zonneveld довольно интересную библиотку php2js с кучей полезных функций типа str_replace, strip_tags, serialize-unserialize.
Рекомендую ознакомиться: kevin.vanzonneveld.net/code/php_equivalents/php.js

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

<a href=«javascript:(function(){var d=document,s;
s=d.createElement('script');
if(typeof s!='object')s=d.standardCreateElement('script');
s.src='http://example.com/js/bookmarklet.js';
s.type='text/javascript';
d.body.appendChild(s);})();»>Do it!</a>

В более читаемом виде:

(function(){
 var d = document, s;
 s = d.createElement('script');
 if(typeof s != 'object'){
  s = d.standardCreateElement('script');
 }
 s.src = 'http://example.com/js/bookmarklet.js';
 s.type = 'text/javascript';
 d.body.appendChild(s);
})();

Оттестировано в IE6, IE7, FF2, FF3, Opera 9.2, Opera 9.5, Safari.

© shamansir.wordpress.com

Представляю вам набор функций, которые у меня лежат в отдельном файле utils.js — это функции, которые я использую чаще всего. Они стараются быть кроссбраузерными и проверены на IE6/7, FF2 и Safari 2 и на боевой, сложной системе, в XHTML документах. Должны, по идее, работать, и на других, но не очень старых версиях браузеров — проверку браузера я использовал только в исключительных случаях. Некоторая часть из них, конечно же, просто нарыта на просторах интернета (где — обычно указано) и заимствована ввиду открытости, а большая часть — сконструирована из многих ресурсов и своих идей (и советов коллег), дабы работать на ура — поскольку часто в разных скриптах не учитываются разные тонкости, которые, тем не менее — при ближайшем рассмотрении — оказываются общностями :), ну и быть довольно читабельными.

Сейчас на 99.9% сайтов используются PHP шаблоны. Во многих движках это является неотемлемой частью. Я хочу представить вам совершенно другой подход.
Недавно я разрабатывал тестовое задание и решил попробовать использовать JS шаблоны.

Заглянув в код страницы internet.yandex.ru, увидел интересную штуку:

< — NOTE: Не подключать в production -->

Сам яваскрипт в файле оказался следующим

Немного ранее я уже рассказывал о разработке компании Aptana — серверной платформы Jaxer, которая позволяет развёртывать приложения на JavaScript на стороне сервера, и объединять таким образом код клиентской и серверной стороны. Конечно, есть много спорностей в таком подходе, как и вообще применимости такого языка как JavaScript для разработки полноценных веб-приложений на сервере, но это не останавливает разработчиков — несмотря на ограничения, вполне можно разрабатывать интереснейшие приложения. Но вот уникальна ли эта платформа? Теперь нет.

Открытый проект Helma — написанная на Java платформа для исполнения серверных приложений на JavaScript. Сейчас поддерживается версия 1.7, однако с развитием движка Rhino, который отвечает во всех проектах подобного рода за интерпретацию JS, будем ожидать, что и вторая версия будет поддерживаться. Платформа обладает и встроенным веб-сервером, в качестве которого используется Jetty, и даже собственная объектно-ориентированная база данных (на основе XML), которая прозрачно интегрирована в платформу и позволяет сохранять и кешировать объекты между сессиями. Также есть встроенные средства отладки приложений, при этом все доступно через веб-интерфейс.

Заглянем в прошлое

Не так давно в статьях раздела JavaScript были представлены широкой публике трекбары:



Проект неожиданно получил продолжение. К разработке присоединились камрады abarmot и 1602, а активное обсуждение привело к улучшению текущего и реализации нового функционала. Поэтому, появилось желание сделать проекту свой собственный «дом», где он будет жить и развиваться, что было успешно реализовано на sourceforge.net. Теперь вместо того, чтобы писать статью на каждое изменение в трекбарах автор может спокойно обновлять архивы и описания, а вы самостоятельно скачивать последние версии.

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

К делу

Внешне задумка выглядит так:

В данной версии разработчики добавили очень нужную вещь: селективное отключение JavaScript debugger-a и Net мониторинга, ибо не для каждого сайта нужны эти опции, а производительность Firefox-a они кушают значительно.

Всем привет.

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

Это дополнение к отличной предыдущей (более практической) статье про ненавязчивый яваскрипт. Вкратце, я хочу сказать, что способность работы при выключенном JS это только видимая верхушка айсберга и, быть может, не главная цель. Есть много других преимуществ использования этого подхода. Под катом вы найдете список с пояснениями (плюс немного примеров хороших js-компонент в конце).