Дизайн мен сценарийдің үздік тәжірибелерімен пішінді жүктеу уақытын оңтайландырыңыз

Баяу жүктейтін пішіндер өнімділікті және пайдаланушының қабылдауын төмендетеді. Пішіндеріңіздің жүктеуінің жылдамдығын арттыру үшін осы кеңестерді ұстаныңыз. Бұл кеңестердің басым бөлігі жасақтаушының сіздің ұйымыңызға арналған пішін сценарийлерін іске асыру әдісіне қатысты болады. Сіздің ұйымыңыз үшін пішін сценарийлерін жасайтын жасақтаушылармен осы кеңестерді міндетті түрде талқылаңыз.

Пішін құрылымы

Пайдаланушының пішінмен өзара әрекеттесуі және оның ішінде көрсетілуі тиіс деректердің өлшемі туралы ойлаңыз.

Өрістердің санын ең аз сақтаңыз
Пішінде өрістердің көп болуына байланысты әрбір жазбаны көру үшін Интернет немесе интражелі арқылы тасымалдануы қажет деректер өлшемі көбейеді.

Пішін сценарийлері

Пішін сценарийлерін пайдаланатын реттеулер болған жағдайда өнімділікті жақсарту үшін жасақтаушының аталмыш стратегияларды түсінетінін қадағалаңыз.

Синхронды сұрауларды пайдаланбаңыз Синхронды сұраулар беттің баяу жүктелуіне және жауапсыз пішіндерге әкелуі мүмкін. Орнына асинхронды сұрауларды пайдалану. Қосымша мысалдар үшін осы блог жазбасын қараңыз.

Қажетсіз JavaScript веб-ресурс кітапханаларын қоспаңыз
Пішінге көп сценарийлердің қосылуына байланысты оларды жүктеу де көп уақыт алады. Әдетте сценарийлер бірінші рет жүктелгеннен кейін шолғышыңызда кэштеледі, алайда пішінде алғаш көрген кездегі өнімділік айтарлықтай әсер қалдырады.

Жүктеу оқиғасында барлық сценарийлерді жүктеуден аулақ болыңыз
Өрістер үшін OnChange оқиғаларды немесе OnSave оқиғасын ғана қолдайтын кодыңыз болса, сценарий кітапханасын OnLoad орнына оқиға өңдегішімен сол оқиғаларға орнатқаныңызға көз жеткізіңіз. Осылайша, аталмыш кітапханаларды жүктеу кейінге қалдырылып, пішінді жүктеу кезінде өнімділікті арттыруы мүмкні.

Веб-ресурстарды жүктеуді кейінге қалдыру үшін жиырылған қойындыларды пайдаланыңыз
Қайырылған қойыншаның ішіндегі бөлімдерге веб-ресурстар немесе IFRAMES қосылған жағдайда, егер қойынша қайырылған болса, олар жүктелмейді. Олар қойынша жайылған кезде жүктеледі. Қойынды күйі өзгерген кезде TabStateChange оқиға орын алады. Тасаланған қойындылардағы веб-ресурстарды немесе IFRAME файлдарын қолдау үшін қажет кез келген код TabStateChange оқиғасы үшін оқиға өңдегіштерін пайдалана алады және OnLoad ішінде орын алуы мүмкін кодты азайтады. оқиға.

Әдепкі көріну опцияларын орнатыңыз
Пішін элементтерін жасыратын OnLoad оқиғасында пішін сценарийлерін пайдаланбаңыз. Оның орнына әдепкі параметр бойынша пішін жүктелген кезде көрінбеуі үшін тасалануы мүмкін пішін элементтері үшін әдепкі көрінетін опцияларын орнатыңыз. Содан кейін көрсеткіңіз келетін пішін элементтерін көрсету үшін OnLoad оқиғасында сценарийлерді пайдаланыңыз. Пішін элементтері ешқашан көрінбейтін болса, олар жасырын емес, пішіннен жойылуы керек.

Пәрмендер тақтасы немесе таспасы

Пәрмендер тақтасын немесе таспасын өңдейтініңізге байланысты осы кеңестерді есте сақтаңыз.

Басқару элементтерінің санын ең аз сақтаңыз
Пішінге арналған пәрмендер тақтасында немесе таспасында, қандай басқару элементтерінің қажетті екенін бағалаңыз және қажетсізін тасалаңыз. Көрсетілген әрбір басқару элементі шолғышқа жүктелуі қажет ресурстарды үлкейтеді.

Реттелетін ережелерде асинхронды желі сұрауларын пайдаланыңыз Бірыңғай интерфейс ішінде желі сұрауларын жасайтын теңшелетін ережелерді пайдаланған кезде, асинхронды ережені бағалауды пайдаланыңыз.

Сондай-ақ, келесіні қараңыз

Пішіндерді жасау және жобалау
Негізгі пішіндер үшін дизайнды қарастыру
Негізгі пішіндер әртүрлі клиенттерде қалай пайда болады