Нестандартни техники за оптимизация за скорост

1. Нестандартни
техники за
оптимизация на
скоростта

2. Кой съм аз?
„Уеб Фейс“ ЕООД е компания създадена през 2009 г., която вече над десет
години предлага изграждане и оптимизация на неповторимо онлайн
присъствие и оптимално потребителско преживяване.
Днес – под името Creativiso® – продължаваме да работим за по-добро web
пространство!
Антон Кацаров е основател и управител на „Уеб Фейс“ ЕООД.
Има над 18-годишен опит в уеб технологиите и онлайн решенията – както в изграждането на
сайтове, така и в оптимизацията им за максимално добро потребителско преживяване.
Антон Кацаров
Те ни се довериха:

3. Кои сайтове се
класират по-добре?
По-бързите?

4. Кой измерва скоростта по-добре?
VS.
Google?
Жена ми?

5. Как оптимизираме за
скорост?
1. Page Speed Insights
2. Предложения
3. Прилагане
4. Page Speed Insights
5. Предложения
6. Прилагане
7. …

6. Как оптимизираме обичайно?

7. 100/100?

8. Един пример от практиката

9. Лабораторни или полеви данни

10. Лабораторни или полеви данни

11. Страниците

12. Кое определя резултата?

13. Oooooops!

14. TBT & TTI

15. Стъпка 1: Lazy CSS Layout
Колко от вас знаят какво е
това?

16. Стъпка 1: Lazy CSS Layout
Не е ли същото като
динамично зареждане на
съдържание?

17. Стъпка 1: Lazy CSS Layout

18. Стъпка 1: Lazy CSS Layout

19. Стъпка 1: Lazy CSS Layout

20. Стъпка 2: JS Lazy Loading

21. Стъпка 2: reCpaptcha

22. Стъпка 3: Icon font
● 240 икони
● SVG sprite vs. Icon font

23. Стъпка 3: Icon font

24. Стъпка 3: Icon font
svgo
--enable =convertShapeToPath,mergePaths,collapseGroups,removeOffCan
vasPaths
--disable =convertPathData website /assets-src /icons/*svg
-o website /tmp/iconfont / &&
icon-font-generator website /tmp/iconfont /*.svg
-o website /assets/fonts
-n website-icons --normalize
--round 0 --mono --height 250
--json=false --html=false
--csspath =website /assets/css/_icons.scss
--csstp=website /assets-src /icons/_icons.hbs

25. Стъпка 4: Web Safe Fonts
Roboto → Arial

26. Резултатът

27. Въпроси?
Пишете ми
a.katsarov@creativiso.bg
LinkedIn
in/anton-katsarov
Посетете сайта ни
creativiso.bg
creativisoxpress.com