Съдържание
Един от проблемите, които имат много приложения, е, че въпреки че зареждат съдържанието бързо, те не се виждат бързо в браузъра на потребителя, тоест браузърът е завършил зареждането на цялото съдържание, всички изображения и всички CSS Y JS, но има малко забавяне между това, което зареждаме и това, което виждаме.Това до голяма степен се дължи на позицията на качените файлове в HTML, тоест, вероятно имаме CSS и JS смесени и това затруднява браузъра да показва всичко, както при зареждане на файл JS трябва да го обработите, преди да продължите към следващия файл.
Първата препоръка е винаги да поставяте стиловите файлове като CSS в горната част на нашия HTML, това ни позволява да накараме браузъра постепенно да показва страницата на приложението възможно най -скоро.
По този начин избягваме да виждаме празна страница за много секунди, преди да видим всичко заредено, ако не виждаме как страницата постепенно се изгражда, това служи за облекчение за потребителите, особено тези, които имат по -бавна връзка с мрежата или интернет .
Ако стиловите листове или CSS са най -отдолу, браузърите обикновено няма да зареждат информацията, за да не се налага да променят стила, след като стигнат до тази точка, което кара потребителя да не вижда нищо.
Целта на това е, че браузърът може да продължи да зарежда ресурсите на страницата, тъй като ако намери JS файл, докато не го зареди без грешки, той няма да продължи да изтегля други ресурси, дори ако те са в CDN.
Къде да поставите JS файловете?За целта поставяме файловете JS доколкото можем в нашия HTML, въпреки че има случаи, когато това не е възможно поради структурата на приложението, тогава можем да поставим атрибута отлагам с което казваме на браузъра, че може да го зареди в края на всичко.
Проблемът с атрибута отлагам е, че не всички браузъри го тълкуват по един и същи начин, така че понякога той не може да направи това, което мислим, но ако можем да поставим файл, този атрибут означава, че той може да бъде преместен до края.
Нека да видим на следващото изображение как протича процесът на зареждане на страница, в първата част всички файлове са отгоре и без определен ред, във втората част са CSS нагоре и JS надолу:
С това приключваме този урок, сега можем да добавим нов елемент за подобряване на скоростта и производителността на нашето приложение в допълнение към намаляване на чакането на потребителя да види какво зарежда браузърът им.Хареса ли ви и помогнахте на този урок?Можете да възнаградите автора, като натиснете този бутон, за да му дадете положителна точка
