Публикации с меткой «JavaScript»

26 декабря 2009г в Киеве пройдут мастер классы - "Профессиональноe javascript-программирование + COMET" и "Секреты клиентской оптимизации".

Мероприятие уникальное, проводится в Киеве впервые.

Ведет мастер-классы Илья Кантор, создатель сайтов http://javascript.ru, http://algolist.manual.ru, в прошлом один из разработчиков Dojo Toolkit, многократный докладчик на конференциях, человек с большим опытом в разработке сложных веб-приложений.

Антон Шевчук написал хороший список вопросов для интервью по приему на работу веб разработчиков. Я хочу предложить вам краткие комментарии и советы по каждому из вопросов, надеюсь это поможет вам лучше ориентироваться в мире веб разработки и поможет пройти интервью.

В ExtJs есть интересные объект Ext.state.Manager, который позволяет запоминать состояние объектов типа Ext.Component. Но для того, что бы Ext.form.Combobox сохранял состояние надо задать некоторые функции в конфиг.

 
stateful: true,

stateEvents: ['select'],

getState: function() {

    return {checked: this.getValue()}

},

applyState: function(state) {

    this.setValue(state.checked);

}

 

stateful - включаем сохраннение состояний
stateEvents - задаём массив событий, по завершению которых, нужно сохранять состояние объекта
getState, applyState - что делать с объектом, при получении состояния и при инициализаии объекта из данных.

Есть такой компонент в библиотеке. Но вот проблема, он "забывает" сортировку в Ext.grid.GridPanel. Сейчас я покажу как его легко и просто от этого отчуить. А если у нас ещё есть и фильтрация на стороне сервера, эти данные он тоже будет помнить как и сам grid.

 
Ext.PagingToolbar.prototype.doLoad =  function(start){
    var o = {}, pn = this.paramNames;
    o[pn.start] = start;
    o[pn.limit] = this.pageSize;
    if(this.fireEvent('beforechange', this, o) !== false){
        o = Ext.apply(this.store.lastOptions.params, o);
        this.store.load({params:o});
    }
};
 

Всего-то переопределили функцию загрузки данных, добавив "o = Ext.apply(this.store.lastOptions.params, o);" вот эту строчку. Эта функция выполняется при любом действиее на toolbar-е.

Куда разместить это код?
- Сразу же после загрузки библиотеки.

Вам наверняка приходилось сталкиваться с проблеммой медленной работы сайта.

Причину того мы обычно ищем в PHP и MySQL, но зачастую забываем о том, что из себя представляет страница, которая попадает в браузер пользователя. Помимо HTML есть еще и Javascript, CSS, множество картинок, флеш объекты и прочее.

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

Несколько подробных статей на эту тему:
* Оптимизация клиентской части
* Как ускорить работу сайта для посетителя
* Скорость имеет значение

Стоит добавить еще несколько вещей

1. Стоит помещать Javascript файлы в конец HTML и использовать только внешние методы для регистрации событий (не использовать атрибутов, типа «onclick» и т.п.). Это поможет избежать ошибок в тех случаях, когда Javascript еще не загружен, а пользователь уже пытается выполнить какое-то действие

2. Стоит заранее сжимать статику gzip-ом, а в отдающем сервере просто отдавать необходимые заголовки. В этом может помочь этот модуль nginx'a

3. Изолируйте отдачу на разные сервера (например, динамику и статику отдавайте с разных серверов) — поможет изолировать проблемы с нагрузками

Данная статья является моим переводом!

Understanding scope in object oriented JavaScript
Розуміння області видимості в об’єктно-орієнтованому JavaScript
Понимание области видимости в объектно-ориентированном JavaScript

Когда вы думаете о ключевом слове this, вы, наверное, считаете, что оно относится к текущему экземпляру класса. Это верно для большинства объектно-ориентированных языков, как C# и Java, но не всегда для JavaScript

Вийшла нова версія UI надбудови поверх jQuery — jQuery UI 1.7.

Нова версія є залежною на jQuery 1.3, тому всі покращення швидкодії які були зроблені в jQuery 1.3 також доступні для jQuery UI 1.7.

Список інших покращень та змін:

ніфікованому фреймворку який дозволить використовувати один дизайн як для основного набору компонент так і для додаткових компонент. ThemeRoller.

jQuery UI 1.7 на Google Ajax Libraries API. Нову версію фреймворка додано до набору Ajax бібліотек від Google.

Всі теми можна завантажити разом.

Новий блог який розповідає виключно про все що відбувається на jQuery UI проекті.



Завантажити jQuery UI 1.7 можна з офіційного сайту.

Тест JavaScript фремворков в различных браузерах.

В качестве инструмента взят тест SlickSpeed.

Испытывались следующие фреймворки:

• MooTools 1.2
• JQuery 1.2.6
• Prototype 1.6.0.2
• YUI 2.5.2 Selector beta
• Dojo 1.1.1

Читаем статью Антона Шевчука о том каким должен быть правильный код для HTML, CSS и JavaScript.

• (X)HTML - markup layer - верстка
• CSS - presentation layer - представление
• JavaScript - behavioural layer - поведение
Метки: CSS, JavaScript, xHTML, культура, стандарты