Файловая структура для веб-приложения на основе javascript
Я планирую написать веб-приложение на основе javascript. Мне интересно, как лучше всего реализовать это с точки зрения структуры файлов.
Есть одна главная страница (main.html), содержащая меню и основной раздел div. Принцип работы прост: когда пользователь нажимает на одну из ссылок в меню (например, «Страница 1»), содержимое раздела div обновляется содержимым файла page1.html. Это делается с помощью javascript (jquery). Если пользователь нажимает «Страница 2», содержимое файла page2.html загружается в раздел div и т. д.
Каждая страница имеет свой собственный код javascript, и, поскольку я предпочитаю держать его отдельно, я реализовал своего рода «код позади», как в asp.net:
page1.html:
<script type = "text / javascript" src = "page1.js "> </ script>
<... HTML-код ...>
page2.html:
<script type = "text / javascript" src = "page2.js "> </ script>
<... HTML-код ...>
Когда пользователь щелкает «Страница 1», содержимое файла page1.html загружается в основной раздел div файла main.html. Поскольку page1.html ссылается на page1.js, также загружается код javascript в page1.js.
Кажется, это работает нормально, но мне интересно, лучший ли это способ реализовать это. В какой-то момент я подумал о том, чтобы сослаться на все файлы javascript в main.html. Это тоже могло бы работать нормально, но это означало бы, что все файлы javascript должны быть загружены в память, даже если они не будут использоваться. При первом подходе файл javascript загружается в память только перед фактическим использованием.
Есть идеи? Каковы «лучшие практики» для этого? Имейте в виду, что это веб-приложение (а не веб-сайт). Он будет доступен через Интернет, но только для некоторых пользователей (и будет защищен паролем), поэтому меня не волнует SEO и т. д.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 3
Возможно, для вас это не имеет значения, но вы знаете, что с точки зрения SEO это ужасная идея. Ваш сайт будет Javascript-версией флеш-сайта. Для поисковых систем будет только одна страница.
Вот почему сайты на основе фреймов, которые были довольно популярны в течение ряда лет, практически исчезли.
Загрузка файлов JavaScript происходит синхронно, что отрицательно сказывается на времени загрузки страницы / воспринимаемой скорости отклика.
По этой причине я думаю, что лучше всего объединить все сценарии в один файл, сжать его с помощью компрессора YUI и отправить gzip. Таким образом вы получите наилучшее сжатие и наименьшие накладные расходы HTTP, а кешированный JS не будет приостанавливать загрузку других страниц.
Для специфичных для страницы динамических скриптов используется встроенный <script>…</script>.
@porneL
есть способы и средства заставить JS загружаться асинхронно (специально создавая теги сценария), но они могут быть сочтены небезопасными
@OP
Я согласен с другими, что это звучит как плохая идея с точки зрения SEO и доступности, проблема производительности с практической точки зрения (есть способы начальной загрузки в коде, но я думаю, это требует больших усилий для минимальной выгоды) и сомнительной эффективности с точки зрения разработки приложений. В качестве гипотетического упражнения я считаю, что решение gzip от porneL является лучшим.
В принципе, я думаю, у вас возникнут проблемы с поиском лучших практик для того, что немногие будут практиковать.