[nohuhu]

Ну как откуда узнал, на практике изучил. ;) Когда два года назад на меня повесили разработку Accessibility, фреймворк пришлось изрядно отрефакторить, чтобы управление фокусом и клавиатурная навигация вообще заработали.

Про "принципы работы" часто люди спрашивают, но сам вопрос мне не очень понятен. Фреймворк сделан для того, чтобы вы могли его использовать и получать (более/менее) одинаково работающие приложения во всех браузерах, которые мы поддерживаем. Есть API документация, есть tutorials, есть курсы. Изучайте и используйте. ;) Зачем вам знание каких-то глубинных вещей? Обычно оно ничем не помогает, только грузит ненужными деталями. Хотя мне и не жалко никогда, так что если есть конкретные вопросы, то спрашивайте. ;)

Асинхронные это и значит, что асинхронные: события выстреливают не в том же цикле исполнения, что и собственно момент фокусирования.

Возьмём вот такой код, для примера:

Ext.onReady(function() {
    var btn = new Ext.button.Button({
        renderTo: document.body,
        text: 'bork!',
        listeners: {
            element: 'el',
            focus: function() {
                console.log('bork focused!');
            }
        }
    });
    
    setTimeout(function() {
        console.log('pre');
        btn.focus();
        console.log('post');
    }, 100);
});

В Chrome/Safari/Firefox/whatever консоль будет выглядеть так:

pre
bork focused!
post

В IE8-11 консоль будет выглядеть вот так:

pre
post
bork focused!

Вот конкретно за эту фигню я ненавижу Microsoft отдельно. Асинхронность фокусных событий это очень, очень больно для фреймворков. :(