Введение в Ext JS

Ext библиотека отличается тремя параметрами от остальных js-библиотек:

  1. Широкой функциональностью.
    Если раньше prototype, jquery , scriptaculous, mootools создавали элементарные объекты для облегчения работы с низкими уровнями DOM и создания анимационных эффектов, то ext нацелен на более сложный интерфейс.
  2. Громадным объемом.
    Для многих разработчиков, пытающихся оптимизировать скорость загрузки страницы очень важен размер каждого файла, поэтому даже от prototype часто отказываются в пользу mootools. Полный пакет Ext весит 454 кб. Если выбирать только нужные модули, то можно уложиться и в 120кб (версия 1.1 бета).
  3. Обширной но мало понятной документацией.
    Извечная проблема ООП библиотек - попытка описать всю функциональность даже если и удаётся то вызывает скорей вопросы чем ответы. Возможно это вызвано и поддержкой prototype/jquery/yui библиотек как "низкого уровня".

Лицензия на использование Ext в коммерческих целях стоит от 200$ на разработчика и не мудрено, учитывая что создатель перешёл из разработки интерфейсов Yahoo.

Дерево

Самым отличительным я нахожу элемент дерево Ext.tree.TreePanel которое умеет при помощи Ext.tree.TreeLoader подгружать через ajax структуру дерева через JSON и позволяет drag-and-drop для элементов, вкупе с контекстным меню. Сам я сделал аналогичное меню, и это действительно не из лёгких задач.

Каждый элемент дерева это объект класса Ext.tree.TreeNode, поэтому через FireBug можно увидеть в JSON параметры id, text, leaf, depth... Увы это пожалуй единственный способ (reverse engineering) что-бы представить себе как происходит взаимодействие данных, поскольку более понятного описания структуры дерева нет. Впрочем всегда есть форум и русский extjs ..

Поняв что даже чуть лучшая функциональность не может перевесить недостатки интеграции и скорости, я даже не стал пробовать другие компоненты. Впрочем как показывает screencast и demos, их хватает:

  • grid предоставляет возможности листинга данных через ajax с сортировкой, фильтрами, мгновенным изменением значений.
  • dialogs заменяют обычные alert, popup, confirm окна на более приятные виды с затуманиванием фона.
  • layouts напоминают фреймы и интерфейс outlook/dreamweaver, где ненужные панели можно спрятать.
RSS