Как правильно структурировать / организовать javascript для большого приложения? - PullRequest
14 голосов
/ 29 ноября 2011

Допустим, вы создаете большое приложение и ожидаете, что на сайте будет много javascript. Даже если вы разделите javascript на 1 файл на странице, где используется javascript, у вас все равно будет около 100 файлов javascript.

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

Ответы [ 3 ]

8 голосов
/ 29 ноября 2011

Лично я предпочитаю шаблон модуля для структурирования кода, и я думаю, что эта статья дает отличное введение: http://www.adequatelygood.com/2010/3/JavaScript-Module-Pattern-In-Depth

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

Я бы структурировал код в отдельных файлах и стремился поддерживать низкую связь и высокую когезию.Хотя несколько файлов плохо влияют на производительность клиента (вам нужно минимизировать количество запросов), вы легко получите лучшее из обоих миров, используя утилиту сжатия.

У меня есть некоторый опыт работы с YUI Compressor (для чегоесть плагин Maven: http://alchim.sourceforge.net/yuicompressor-maven-plugin/compress-mojo.html - я сам этим не пользовался).Если вам нужно упорядочить файлы javascript определенным образом (также применимо к CSS), вы можете создать сценарий оболочки, заранее объединяя файлы в заданном порядке (Совет: по умолчанию для YUI Compressor установлено значение STDIN).

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

Вы упомянули пространства имен, что является хорошей идеей, но я бы с осторожностью перенял слишком много понятий из традиционной объектно-ориентированной области и вместо этого научился использовать многие из замечательных возможностей языка javascript:)

5 голосов
/ 29 ноября 2011

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

1 голос
/ 29 ноября 2011

Использование:

  • jslint - для проверки качества кода.
  • require.js - чтобы получить только тот код, который вам нужен для каждой страницы (или эквивалент).

Организуйте свой js так же, как любой другой программный проектРазбейте его по ролям, обязанностям и разделению интересов.

...