JavaScript, мысли "вслух"

jQuery extension, add support `classList`.

GitHub — https://gist.github.com/RubaXa/5575339
jsPerf — http://jsperf.com/classlist-jquery/2

Pilot: v1.2.0

New features

req — now the instance of Pilot.Request.
Added Pilot.utils

each(el/**Object|Array*/, fn/**Function*/[, thisArg/**Mixed*/])
extend(a/**Object*/, b/**Object*/)/**Object*/
qs.parse(queryString/**String*/)/**Object*/
qs.stringify(params/**Object*/)/**String*/

http://rubaxa.github.io/Pilot/

jQuery extension, add support `scrollstart` and `scrollend` events.

/**
* @flags
* $.isScrolled; // boolean
*
* @binding
* $(window).bind('scrollstart scrollend', function (evt){
*   if( evt.type == 'scrollstart' ){
*   // logic
*   }
* });
*/
https://gist.github.com/RubaXa/5569075

Pilot: Now in English

Multifunctional JavaScript router solves the problem of routing your application, providing full control over the route. It can work either by itself or as a part of other framework, such as Backbone, in which it could be an excellent substitute for the standard Backbone.Router and even Backbone.View. Just try it.

npm — https://npmjs.org/package/pilotjs
GitHub — https://github.com/RubaXa/Pilot
Documentation — http://rubaxa.github.com/Pilot/#en/

Все проще, чем кажется

function foo(el/**Mixed*/){

if( el && el.jquery ){

// это jQuery коллекция

el = el[0];

}

/*__*/

}

Pilot: многофункциональный javascript роутер

http://habrahabr.ru/company/mailru/blog/172333/
http://rubaxa.github.com/Pilot/
https://github.com/rubaxa/Pilot/

jQuery: memory leaks

Думаю, для многих не секрет, что при назначении обработчика события, в `jQuery.cache` добавляется ссылка на этот элемент. И если вовремя не снять слушателя, это приведет к утечке памяти.

Чаще всего, такая проблема возникает, если работать с DOM напрямую, минуя методы jQuery, например, используя innerHTML.

<div id=”layout”>
        <button>click me</button>
</div>

<script>
        // Вешаем обработчик
        $(‘button’).click(function (){
                    // Загружаем какой-то html
                    $.get(‘/layout’, function (content){
                                // Заменяем текущие содержание на новое
                                $(‘#layout’).prop(‘innerHTML’, content );
                    });

});

</script>

В примере содержимое `#layout` заменяется и ссылка на элемент `button` «застревает» в `jQuery.cache`. Если перед заменой, вызвать `$(‘#layout’).empty()`, то утечки не будет.

Причина использования `innerHTML` в медленной работе jQuery методов. Случается, что при вызове $.fn.html/append (и подобных), браузер подвисает намертво.

Однако использование методов jQuery, для работы с DOM, не гарантирует, что утечки не будет.

Проблемы можно получить даже в достаточно просто коде:

$(new Image)
.attr(“src”, “http://domain.com/fail.png”)
.one(“load”, function (){ /*__*/ })

;

На первый взгляд, код безопасен, но происходит ошибка и событие `load` не отрабатывает — код “потек”.

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

Чтобы избежать таких ситуаций, я разработал маленькую утилиту, которая следит за объектом `jQuery.cache` и элементами, находящимися в нем. Если элемент не находиться в DOM, то он считается “утёкшим”.

Утилита содержит всего четыре метода:

$.leaks.get() — получить список “утёкших” элементов;

$.leaks.watch() — начать слежение за утечками, если они возникают в console будет выведено количество “утёкших” элементов (“jQuery leaks: XX”);

$.leaks.unwatch() — остановить слежение;

$.leaks.remove() — удалить “утечки” (вызов `$.clearData($.leaks.get())`).

Надеюсь данная утилита будет вам полезна.

Исходник — jquery.leaks.js