Анализируя производительность JSF 2.1 + PrimeFaces 4.0 webapp с Google PageSpeed , он рекомендует, в частности, откладывать анализ файлов JavaScript. На тестовой странице с <p:layout> и формой с <p:watermark> и <p:fileUpload>, которая выглядит следующим образом...
<p:layout>
<p:layoutUnit position="west" size="100">Test</p:layoutUnit>
<p:layoutUnit position="center">
<h:form enctype="multipart/form-data">
<p:inputText id="input" />
<p:watermark for="input" value="watermark" />
<p:focus for="input" />
<p:fileUpload/>
<p:commandButton value="submit" />
</h:form>
</p:layoutUnit>
</p:layout>
... в нем перечислены следующие файлы JavaScript, которые можно отложить:
-
primefaces.js(219.5KiB) -
jquery-plugins.js(191.8KiB) -
jquery.js(95.3KiB) -
layout.js(76.4KiB) -
fileupload.js(23.8KiB) -
watermark.js(4.7KiB)
Он ссылается на эту статью Google Developers, в которой объясняется отложенная загрузка, а также как ее достичь. Вам в основном нужно динамически создать желаемый <script> в течение onload события window. В своей простейшей форме, когда старые и багги-браузеры полностью игнорируются, это выглядит так:
<script>
window.addEventListener("load", function() {
var script = document.createElement("script");
script.src = "filename.js";
document.head.appendChild(script);
}, false);
</script>
Хорошо, это выполнимо, если у вас есть контроль над этими сценариями, но перечисленные скрипты все автоматически включаются JSF. Кроме того, PrimeFaces предоставляет кучу встроенных скриптов для вывода HTML, которые напрямую вызывают $(xxx) из jquery.js и PrimeFaces.xxx() из primefaces.js. Это означало бы, что нелегко было бы действительно отложить их до события onload, поскольку вы только закончите с ошибками, такими как $ is undefined и PrimeFaces is undefined.
Но это должно быть технически возможно. Учитывая, что только jQuery не нужно откладывать, так как многие пользовательские скрипты сайта также полагаются на него, как я могу блокировать JSF принудительно автоматически, включая скрипты PrimeFaces, чтобы я мог их отложить, и как я могу справиться с этими inline PrimeFaces.xxx() вызывает?
