firebug 1.1 (beta)

И всё-таки он обновляется! (да-да – а земля круглая и вертится).

Самые, на мой взгляд, вкусные изменения это закладка “Stack” в отладчике. (Её как раз стало очень нехватать – ранее стек вызова показывался в строке с меню и тупо не помещался в ней) и возможность использовать внешний редактор(!) по умолчанию это aptana.

Появились и визуальные изменения – подсветка исполняемого блока кода например. А вот «“better” debugging icons» по-моему паршивые – старые были привычнее и симпатичнее…

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

Technorati Tags: ,

01.10.07  |   | стань первым

jQuery.facts

Расскажу несколько фактов о jQuery, которые как мне видится, не очень понимают “отечественные программеры”

  • при “навешивании” обработчика какого-либо event-а к (например $(‘#element’).click(handler); ) он НЕ заменяет предыдущий обработчик (если таковой имелся), т.е. код:
    $('#element').click(function(){  alert('hello');})
    $('#element').click(function(){  alert('world'); })
    

    Выведет оба alert-а, а не только второй как думается некоторым.

  • Непосредственно из первого вытекает следующий факт – конструкций $(document).ready(blablabla); в коде может быть “бесчисленное” количество раз – все обработчики вызовутся в порядке их добавления.
  • Система событий в jQuery позволяет не ограничиваться теми событиями, которые есть в документации – можно создавать события самостоятельно:
    $('button').click(function(){ jQuery.event.trigger("buttonClicked");});
    $('div').bind('buttonClicked',function(){ $(this).hide();});
    $('span').bind('buttonClicked',function(){ $(this).show();});
    

    Подобная техника позволяет существенно упростить код и сделать его “читабельнее”.

  • Анимационные эффекты в jQuery асинхронны и нередко возникает вопрос – как одну функцию выполнить строго после завершения первой. Все core-функции jQuery связанные с эффектами в качестве последнего параметра принимают callback – функцию, которая вызовется по завершению текущего эффекта:
    $('element-1').fadeOut(3000,function(){
          $('element-2').fadeIn(1500,function() {
          alert('done second effect');
       });
    });
    
  • К ЛЮБОМУ html-элементу можно добавить ЛЮБОЙ атрибут (). По этим “самодельным” атрибутам элементы можно найти с помощью селекторов jQuery:
    var elements_by_attr = $('[@myownattr]');
    var elements_by_attr_with_value = $('[@myownattr="somevalue"]');
    var spans_by_attr = $('span[@myownattr]');
    

    Очень полезное “явление” при создании своих собственных элементов управления (и не только).

Ну и напоследок подкину найденную статейку “jQuery for JavaScript programmers”, прочитать которую стоит тем, кто только начинает осваивать прелести jQuery . Материал изложен на английском.

21.08.07  |   | 4 comments

checklistbox.js

checklistbox
На просторах интернета не нашлось достойного js-контрола – аналога CheckListBox. Восполнил этот недостаток плагинчиком для jQuery. Как и всё в мире jQuery – применяется ненавязчиво и просто – заменяет собой <select> $(“select”).checklistbox();

Взять можно здесь.

31.07.07  |   | стань первым

jspacker и другие приключения Шурика

Напишу-ка я ещё разок про packer. phing, нормы бухгалтерского учёта и ещё про чё-то.

В предыдущей своей чудовищной заметке про компрессию javascript-ов я упоминал perl-версию packer-а Дэна Эдвардса.
Её приходилось запускать через exec (и соответственно нужен perl). А вот совсем недавно нашёл реализацию этого мега-алгоритма на php и даже не одну.

Соответственно первая реализация была “впендюрена” в phing.task.ext.JsPacker.Task, а вторая напомнила о том что давно собирался изложить.
А именно – про gzip-сжатие js-файлов:

Собственно проблем ровно никаких – mod_gzip в apache, gzip on; в nginx и можно тему закрывать. Но как обычно “есть нюансы”: не всегда эти модули установлены на сервере, не всегда их получается установить, ну и главный “нюанс”: файлы статические, закономерно возникает мысль – зачем их упаковывать при каждом запросе? Вот об этом я и хотел рассказать, но не буду ;o)

Собственно решение прямо в лоб – упаковать файлы один раз и “задеплоить” на сервер. Я это(сжатие) делаю с помощью всё того же phing-а, а решение о том какой файл (сжатый или нет) отдать клиенту принимает mod_rewrite:

RewriteEngine on
RewriteRule ^(.*\.js\.gz)$ – [L]
RewriteCond %{HTTP:Accept-Encoding} gzip
RewriteCond %{REQUEST_FILENAME}.gz -f
RewriteRule ^(.*)$ $1.gz

Это содержимое .htaccess который лежит в директории с js (или httpd.conf в секции Directory/Location отвечающей за эту же директорию).

Смысл вроде прозрачен, но я поясню – если рядом с файлом moi-super-bolshoy-javascript.js будет находиться его сжатая копия moi-super-bolshoy-javascript.js.gz и в запросе будет явно указано, что клиент поддерживает gzip-encoding, то ему(клиенту) выдадут именно сжатую копию. В противном случае (сжатие не поддерживается или сжатого файла нет) в ответ вернётся оригинальный файл.

В итоге уменьшили трафик сервера(и естественно клиентов) и снизили нагрузку на сервер.

Естественно этот фокус можно (и даже наверное нужно) проделать с css.

P.S.
Далеко не все файлы стоит упаковывать зипом . И не каждый файл стоит упаковывать packer-ом – стоит проверить результат на jsl(int)-ом – не редки случаи “поломки” скриптов. Ну а как упаковать оптимальнее – решать индивидуально с каждым файлом предстоит вам.

Update

А вот нашёлся способ отдачи gzip-ованного контента даже лучший, чем описал я.

05.05.07  |  , ,  | 11 comments

Announcing the SWFFix project

Geoff Stearns и Bobby van der Sluis задумали осуществить маленькую революцию и наконец “устаканить” процедуру вставки flash-ек на web-страницы.

Товарищи(господа?) решили сделать “мега-супер-пупер” универсальную библиотеку для вставки swf в (x)html-страницы, избавляющую от вездесущих глюков и багов в MSIE различных браузерах, объединив функционал SWFObject и UFO и не упустив из виду другие популярные swf-related приложения (вроде SWFAddress и SWFUpload)

И дело анонсом не закончилось – уже есть сводная таблица методов внедрения swf и поддержкой оных в различных браузерах, которая впрочем пока (надеюсь только пока) не содержит linux-овых бродилок.

От всей души желаю товарищам(господам?) удачи!
Upd: “Это” скоро кончиться
Technorati Tags: , , , ,

20.02.07  |   | 2 comments

jquery button

jquery обзавёлся собственной promote-кнопочкой.
Сам за неё голосовал – симпатичная и ненавязчивая:

jQuery JavaScript Library

В догонку: у jquery есть наглядный мануал

Update:
нашёлся русский перевод руководства по jquery для новичков – может кому-нибудь пригодиться…
Technorati Tags: , , ,

jquery,IE и window.onload

Ещё немного о jquery:
замечательный метод ready в IE в некоторых случаях не желает работать.
Документация честно предупреждает о том, что если для body уже есть onload-handler, то метод может не сработать. Но обработчиков нет, а ready срабатывает 2 раза из 10 попыток. При этом иногда IE ещё не успевает обсчитать некоторые свойства объектов (замечено на offsetTop).
А если отложить выполнение даже на 1 миллисекунду (через setTimeout), то всё выполняется так как задумано.
На помощь приходит функция из БазыЗнанийXpoint-а о которой я писал раньше. Работает как часы (но без timeout-ов).

Как же достал этот IE…

Technorati Tags: , , , , ,

11.10.06  |  , ,  | стань первым