Мне действительно нужны все файлы, которые загружает загрузчик YUI3? - PullRequest
0 голосов
/ 16 февраля 2012

Я использую public release 2 из Yahoo User Interface (YUI) 3.5.

Я добавил файл yui-min.js в свое представление. Все, что я делаю, это подписываю кнопку на событие щелчка, переводя пользователя в другое представление. Ничего особенного.

Вот моя ссылка на скрипт и мой скрипт, когда я подписываю кнопку на событие click:

<script src="/Assets/yui_3.5.0pr2/yui/build/yui/yui-min.js"></script>

<script>

     YUI().use('node', 'event', function (Y) {
          Y.one('#cancel').on('click', function (e) {
               window.location = '/Administration/User';
          });
     });

</script>

Но при загрузке страницы 39 requests загружает все файлы css и другие необходимые файлы YUI3. Я могу поместить все 5 моих css файлов в 1, но это все еще 35 запросов. И общий размер загрузки составляет около 176kb.

cssreset-min.css
cssfonts-min.css
cssgrids-min.css
cssbase-min.css
admin.css
yui-min.js
oop-min.js
event-custom-base-min.js
dom-core-min.js
dom-base-min.js
selector-native-min.js
selector-min.js
node-core-min.js
node-base-min.js
event-base-min.js
event-delegate-min.js
node-event-delegate-min.js
pluginhost-base-min.js
pluginhost-config-min.js
node-pluginhost-min.js
dom-style-min.js
dom-screen-min.js
node-screen-min.js
node-style-min.js
event-custom-complex-min.js
event-synthetic-min.js
event-mousewheel-min.js
event-mouseenter-min.js
event-key-min.js
event-focus-min.js
event-resize-min.js
event-hover-min.js
event-outside.js
event-touch-min.js
event-move-min.js
event-flick-min.js
event-valuechange-min.js
intl-min.js

Это не имеет смысла для меня. Почему загружаются все эти файлы, а я не использовал их все или нет? В чем выгода этого? Что я делаю, все ли эти файлы javascript используются или загрузчик YUI загружает дополнительные файлы, которые не используются?

1 Ответ

0 голосов
/ 16 февраля 2012

В данном конкретном случае, и только для того, что вам нужно, может помочь небольшая настройка. Во-первых, вам не нужно загружать файлы CSS. В этом случае просто используйте параметр конфигурации fetchCSS. Тогда вам, вероятно, не понадобятся все модули Node и Event, чтобы подписаться на простое событие. Просто node-base вполне достаточно. Таким образом, вы можете попробовать это:

YUI({ fetchCSS: false }).use('node-base', function (Y) {
  Y.one(button).on('click', fn);
});

Это сокращает до 11 файлов и 18 Кбайт с помощью Gzip.

Но, в общем, почти каждый файл необходим. Причиной такого количества файлов является то, что команда YUI изменила процесс сборки и пошла на более детальный подход. Таким образом, загрузчик может получить то, что ему нужно, и избежать загрузки большого количества ненужного кода. Недостатком является то, что если вы размещаете его самостоятельно и не используете систему для объединения файлов, загрузка загружается очень медленно.

Я бы посоветовал взглянуть на Combohandler Райана для NodeJS: https://github.com/rgrove/combohandler. Существуют другие подобные проекты для других серверных платформ.

...