Кескінді жүктеуді оңтайландыру

Lazy Load технологиясы туралы.
Tilda қызметінде Lazy Load режимі барлық сайттар үшін әдепкі бойынша қосылады. Бұл веб-сайттарға, тіпті мобильді құрылғыларға да өте жылдам жүктеуге мүмкіндік береді.
Lazy Load технологиясын енгізу тильдадағы алаңдарды тезірек жүктеу үшін оңтайландыру кезеңдерінің бірі болып табылады. Технология дамып келеді, біз жүктеуді одан да жылдамдату үшін үнемі жұмыс істеп келеміз.
Lazy Load — көрініс портынан тыс суреттерді жүктеуге тосқауыл қоятын плагин. Яғни, суреттер пайдаланушы бет арқылы айналдырған сайын жүктеледі. Оның қалай көрінетінін көрейік.

Үлгілердегі стандартты бетті алып, жариялайық. http://project130385.tilda.ws/

Браузер инспекторын ашыңыз, параметрлерде баяу Интернет жылдамдығының (3G) еліктеуін қосыңыз және бетті қайта жүктеңіз.
DOMContent Жүктелген: 628 миллисекунд
Барлық маңызды сценарийлер мен HTML жүктелді деген параметр, яғни пайдаланушы бетті әлдеқашан көре алады.

Аяқтау: 1,65 секунд
Бүкіл учаскені жүктеуге қанша уақыт кеткенін көрсететін параметр.

Ауыстырылды: 263 кб
Қанша байт ақпарат берілгенін көрсететін параметр.
Сандар өте оптимистік! Бірақ бәрі салыстыратын болсақ үйренуде. Сайт параметрлері > Lazy Load режимін өшіріп тастайық. Бетті қайтадан тексерейік.
DOMContent Жүктелген: 697 миллисекунд
Барлық маңызды сценарийлер мен HTML жүктелді деген параметр, яғни пайдаланушы бетті әлдеқашан көре алады.

Аяқтау: 10,14 секунд
Бүкіл учаскені жүктеуге қанша уақыт кеткенін көрсететін параметр.

Берілді: 1,8 мб
Қанша байт ақпарат берілгенін көрсететін параметр.
Бет жүктемесінің жалпы уақыты мен берілген ақпараттың көлемі едәуір өсті.

Google PageSpeed дегеннің не айтатынын көрейік. Оңтайландыру ажыратылған бетті тексерейік:
Және Жалқау жүктемені қосып:
Lazy Load пайдаланушыға көрінбейтін суреттерді бұғаттайды, сондықтан сайттың жүктелуін жылдамдатады.
Lazy Load режиміне қосымша сайтқа жүктелген суреттерді оңтайландыру қажет. Бұл Google сынағының нәтижелеріне әсер ететін суреттердің салмағы. Салмағын азайту үшін Tinypng сияқты арнайы құралдарды пайдалануға болады.
Ескерту
Беттің жоғарғы жағындағы дисплейді блоктайтын JavaScript және CSS-ті қалай жоюға болады?
Бұл тесттен өткеннен кейін туындап отырған кең тараған сұрақ. Google беттің жоғарғы жағында сценарийлердің бар екендігі туралы өте қатаң.
Теориялық тұрғыдан сценарийлерді жоюға болады, бірақ бұл автоматты талдау болғандықтан үстемелер жасау керек, дәлме-дәл емес. Бұрын көріп отырғанымыздай, Lazy Load қосылғанда беттер өте тез жүктеледі — оңтайландыруға болатынның бәрі қазірдің өзінде оңтайландырылған. Сценарийлерді жою 0,3 секунд пайда әкеледі деген қорытындыға келдік, ол ештеңені түбегейлі өзгертпейді.

Сондықтан біздің ұстанымымыз Google-дың беттің жоғарғы жағындағы сценарийлер туралы автоматтандырылған тестті бақылауын елемей отырмыз.

Айтпақшы, Google өз сынағынан қалай өтеді?
Оопс.
20__ жылғы «___» __________
Тильда