Страницы Primefaces загружаются медленно после увеличения версии jQuery
Моя предыдущая версия Primefaces была 6.0. Я обновил его до Primefaces 10.0 (с помощью раздела миграции на их веб-сайте). В Clean&Build и Debug ошибок нет. Хотя с обновлением проблем не возникло, почти в 50% случаев веб-страницы загружаются медленно или не загружаются вообще.
Я обнаружил, что эта проблема начинается после Primefaces 6.2. В Primefaces 6.2 версия jQuery увеличена до версии 3.2.1. Единственное изменение, которое я сделал, это то, что я обновил файлы js с точки зрения on('load'), удалив функцию .load(). Есть проблема с медлительностью, но ошибок в консоли браузера нет.
Затем я установил jQuery 2.2.4 с помощью специального обработчика в Primefaces 10, и это устранило проблему. Итак, проблема начинается после того, как jquery становится выше 3.0.x. Но я не могу использовать 2.2.4 по двум причинам. Во-первых, развертывание на стороне сервера не происходит, когда я использую собственный обработчик для jQuery. Во-вторых, это создает среду для уязвимостей безопасности.
Что может быть причиной этой проблемы выше 3.0.x и как ее решить?
Обновлено:
ПРЕДУПРЕЖДЕНИЕ КОНСОЛИ: jQuery(window).on('load'...) вызывается после возникновения события загрузки
@Melloware
У меня был этот код в resources/default/js/menu.js
jQuery(document).ready(function ($) {
$(window).load(function () {
setTimeout(function () {
$(LOADER).fadeOut('slow', function () {
});
}, LOADER_DELAY);
});
});
Я изменил его на:
jQuery(document).ready(function ($) {
$(window).on("load",function () {
setTimeout(function () {
$(LOADER).fadeOut('slow', function () {
});
}, LOADER_DELAY);
});
});
Теперь, используя плагины jquery-migrate, я получил предупреждение Событие on("load") начинается после события загрузки
Я разделил код на:
jQuery(document).ready(function ($) {
});
$(window).on("load",function () {
setTimeout(function () {
$(LOADER).fadeOut('slow', function () {
});
}, LOADER_DELAY);
});
Сейчас страница загружается, но хороший ли это подход?
РЕДАКТИРОВАТЬ2:
Если я разделю такой код (разделяя готовый документ и документ при загрузке), приложение не развернется на сервере. Я меняю файл, расположенный в webapp/resources/default/js/menu.js. Когда я возвращаюсь в старое состояние, оно развертывается на сервере. Сбой развертывания не дает никаких ошибок. Каким-то образом изменение в этом js-файле нарушает развертывание сервера. Как я могу это решить?
@Melloware Привет, спасибо, не могли бы вы проверить соответствующий раздел редактирования, пожалуйста?
Ответы 1
Хорошо, я решил, что обе веб-страницы не загружаются, и приложение не может развернуться на сервере, изменив это:
jQuery(document).ready(function ($) {
$(window).on("load",function () {
setTimeout(function () {
$(LOADER).fadeOut('slow', function () {
});
}, LOADER_DELAY);
});
});
В это:
(function($) {
$(window).on("load", function () {
setTimeout(function () {
$(LOADER).fadeOut('slow', function () {
});
}, LOADER_DELAY);
});
})(jQuery);
Кроме того, полностью удалив jQuery(document).ready() вместо того, чтобы оставлять его пустым.
Хм, странно, я никогда о таком раньше не слышал. Что вы изменили в своей функции
load(), похоже, именно здесь начались ваши проблемы? Также вы используете рекомендации по повышению производительности, такие как MOVE_SCRIPTS_TO_BOTTOM, которые можно найти здесь: primefaces.github.io/primefaces/14_0_0/#/core/…