Проблемы с производительностью в большом приложении jQuery

Question

У меня есть веб-приложение с 8 вкладками в меню. Когда я нажимаю на одну вкладку, текущее содержимое исчезает и появляется контент, специфичный для вкладки.

Эта вещь работает отлично, но приложение работает довольно медленно, так как fadeIn и fadeOut выполняются на очень большом html (возможно, около ~ 2000 строк/вкладок) содержимом, которое заставляет все приложение замедлять работу.

Что я могу сделать, чтобы сделать его быстрым и плавным.

Вот некоторые сомнительные моменты у меня есть ...

1. Могу ли я загрузить содержимое вкладки с помощью AJAX, а не загружать их все в один присест?

2. Если я загружаю их через AJAX для ex Tab, а затем пользователь нажимает на Tab B, я должен удалить содержимое вкладки A из DOM и перезагрузить его при нажатии Tab A Again или оставить его в DOM ,

3. Что произойдет с обработчиками кликов, поскольку в этом случае мне понадобится привязка динамических событий.

4. Что еще можно сделать для повышения производительности?

Большое спасибо!

Answer 1

Ну, у нас была такая проблема, где у нас есть около 10 вкладок и вам нужно загрузить данные. Упомянутые вами сомнения уже обратились к решению. Я определю ват, который мы выполнили, чтобы выполнить задачу с более гладким и идеальным результатом.

1. Мы привязываем данные на вкладке, используя метод Ajax, вместо того, чтобы создавать элементы на сервере runat. Мы привязываем его к манипуляции с Dom.
2. Если есть сетка, у которой будет большой набор суммы, данные привязки для разбивки страницы evey, а для загрузки всего набора данных.
3. На каждой вкладке загружаются данные, данные и данные на предыдущей вкладке очищаются. Или в позицию по умолчанию.
4. Если большой набор, если данные остаются на html, поэтому Dom также будет тяжелым и, в свою очередь, замедлит ваше приложение. 5.Чтобы выполнить эту задачу, вам необходимо создать Ajax-вызовы и больше Dom.manupulation, которые заинтересуют больше времени. Поэтому нужно решить путь, по которому вы хотите идти.

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

1. Проверьте, есть ли тяжелый образ, который займет некоторое время, чтобы загрузить или медленнее вниз вам страницу, чтобы конкурировать всю нагрузку
2. Удалите ссылку любой неиспользуемой JS файл или CSS.
3. Пользователь async и отложить с помощью внешних скриптов.
4. Старайтесь не использовать больше элементов на стороне сервера, которые загружают вашу страницу, потому что они собираются связываться на стороне сервера. Это делает вас страницей тяжелой.
5. В некоторых случаях техника компрессии также полезна для меня.
6. Ответы на Ajax и обработка на стороне клиента лучше всего, а скорее отправить всю страницу со стороны сервера. !!!

По моему опыту, это то, чему я научился и реализую при работе с веб-приложением, чтобы улучшить производительность приложения.