Скорост на сайта и асинхронен Javascript

асинхронен

Въпреки че правя много разработки, не се класифицирам като истински разработчик. Мога да програмирам и премествам неща на една страница и да я накарам да работи. Истинският разработчик разбира как да разработи кода, така че той да може да се мащабира, да не отнема много ресурси, да се зарежда бързо, да бъде лесно модифициран по-късно и все пак да работи.

Трудното място, на което са поставени търговците, е и двамата да имат много бърз уеб сайт и все още включва интеграции и социални елементи, които могат да създадат зависимост от това колко бързо ще се зареди вашият сайт. Един такъв пример е социални бутони. В Martech имаме социални бутони на всяка отделна страница в сайта. Така че ... ако ресурсите на Facebook се зареждат бавно един ден, това забавя нашия сайт. След това добавете Twitter, Pinterest, Buffer и др. Към това и шансовете на вашия сайт да се зареди бързо се свеждат до почти нищо.

Това е известно като синхронно зареждане. Трябва да завършите зареждането на един елемент преди зареждате следващия елемент. Ако можете да зареждате елементи асинхронно, вие можете да зареждате елементи без зависимост един от друг. Можете драстично да подобрите скоростта на вашия сайт, като асинхронно зареждате елементи. Проблемът е, че готовите скриптове, които тези компании ви предоставят, почти никога не са оптимизирани да работят асинхронно.
асинхронен

Можете да видите какво влияе върху скоростта на страницата ви, като изпълните тест на Pingdom:
зареждане на страницата на pingdom

Асинхронен Javascript ви позволява да пишете код, който казва на елементите да се зареждат след страницата е напълно заредена. Няма зависимости! И така, страницата ви се зарежда и след като приключи, се инициира скрипт, който зарежда останалите елементи - в този случай нашите социални бутони. Ако сте разработчик, можете да прочетете страхотна статия, Мързеливо зареждане на асинхронен Javascript.

Ето фрагмент за това как да го направите правилно от Емил Стенстрьом:

(function () {function async_load () {var s = document.createElement ('script'); s.type = 'text / javascript'; s.async = true; s.src = 'http://buttondomain.com /script.js '; var x = document.getElementsByTagName (' script ') [0]; x.parentNode.insertBefore (s, x);} if (window.attachEvent) window.attachEvent (' onload ', async_load); else window.addEventListener ('load', async_load, false);}) ();

Резултатът е, че ако тези интеграции на трети страни не работят или работят бавно, това никога не оказва влияние върху съдържанието на основната ви страница. Ако прегледате източника на нашата страница, ще видите, че зареждам всички допълнителни социални скриптове, използващи тази техника. Процеса подобри секундите за скорост на нашия сайт - и не се задавя по време на зареждането. Не сме преобразували всички наши външни зависимости в Асинхронен Javascript, но ние ще го направим.

Какво мислите?

Този сайт използва Akismet за намаляване на спама. Научете как се обработват данните за коментарите ви.