Разделение кода JavaScript в нескольких файлах: лучшие практики

#javascript #extjs

#javascript #extjs

Вопрос:

Я работаю с ExtJS всего 2 недели. И весь мой код выглядит как один большой файл. У меня есть много включенных панелей и других объектов ExtJS в коде. Выглядит как большое дерево) Кто-нибудь может дать несколько простых советов по определению и хранению частей кода в файлах JS?

Ответ №1:

Вещи, которые помещаются в их собственный файл, делятся на две широкие категории:

Модели

Любая функция конструктора объекта. Любой набор функций, которые обрабатывают данные. Любая бизнес-логика. Логика проверки.

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

Число просмотров

Все, что отображается на странице. Файлы шаблонов. все, что манипулирует объектами DOM.

Есть также разные вещи, которые помещаются в их собственные файлы

  • Взаимодействие сервер-клиент, Websockets, ajax.
  • Микро-фреймворки
  • Пояса утилит
  • Помощники по маршрутизации.

Есть некоторые вещи, которые трудно вставить в собственные файлы, такие как обмен сообщениями на основе событий, который связывает ваши представления с вашими моделями.

Обычно вы хотите либо использовать инструмент упаковки, чтобы объединить все ваши маленькие файлы в один большой файл для отправки на сервер, либо использовать загрузчик модулей, такой как require.

Все, что, по вашему мнению, может быть модульным, может быть помещено в отдельный файл.

Комментарии:

1. Больше сказать особо нечего. По соображениям производительности вам следует сократить вызовы к серверу, но это также рассматривалось выше.

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

3. На данный момент я использую YUI Compressor для . Net yuicompressor.codeplex.com . Но я планировал поближе познакомиться с компилятором Google Closure. Я создаю до 75% своего JavaScript «на лету», поэтому я выбираю этот

Ответ №2:

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

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

  • BearsAreNotDeadly.js
  • Search.js
  • Tutorials.js
  • GruesomePictures.js
  • ComplaintForm.js

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