Подобряването на скоростта на вашия сайт спомага на клиентите ви по-пълноценно да се възползват от това, което предлагате; увеличава скоростта на зареждане всяка страница (често води и до по-добро класиране в резултатите на търсещите машини); и създава впечатление за по-стабилен и професионален магазин.

Най-добрият начин за представяне на техниките, които се препоръчват за този тип онлайн магазини е чрез пример. Ще разгледаме тест инсталация на OpenCart 1.5.4.1 на сървър и ще проведем тест за скорост на страницата, за да установим колко бърз е магазинът в момента. Ще използваме данните като база за сравнение, която ще ни помогне да проследим напредъка в процеса. Магазинът работи със споделен хостинг предоставен от www.superhosting.bg, само данните за продукта по подразбиране. Резултатите са F (по A-F скала, където F е най-ниско) за скорост на страница и C за YSlow. След всеки съвет ще провеждаме същият тест отново, за да покажем как акумулативният ефект подобрява скоростта на OpenCart инсталацията.

Скорост на сайта преди оптимизиране (Opencart)

Съвет за ускоряване 1: Изключете продуктовите броячи за категориите

Категории на opencart с брояч на продуктите в тях

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

И така, какво ще стане ако го изключим? За щастие екипът на OpenCart разбира влиянието на този инструмент върху скоростта на зареждане на страница и затова осигурява леснодостъпна опция в админ панела за бързо изключване на продуктовия брояч. System->Settings->Edit-> Изберете “Option” Tab, след това променете “Category Product Count” на No и натиснете Save.

Резултат след оптимизиране на opencart и спиране на брояча на продуктите в категориите

Въздействие: Ниско

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

Съвет за ускоряване 2: Позволете GZIP компресия

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

Влезте в системата на OpenCart магазина:

System->Settings->Edit->Изберете “Server” Tab и променете “Output Compression Level” на стойности между 4 и 6. Имате опцията да изберете между 0 и 9, но практиката показва, че най-ефективните резултати се постигат при средни стойности. По-високите показатели компресират повече файловете, но изискват повече време.

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

# compress text, HTML, JavaScript, CSS, and XML
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATЕapplication/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
# remove browser bugs
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
Header append Vary User-Agent


По този начин сайтът е настроен да компресира външни скриптове. Какво показва теста за проверка?

Голямо подобрение на скоростта на сайта – Opencart

Въздействие: Високо
Ефектът е много голям. Скорост на зареждане на страницата е 70% (оценка 3). Оценката YSlow тук е C 77%.
Само след два приложени съвета за забързване на скоростта сайтът е много по-бърз от началото.

Съвет за ускоряване 3: Позволете браузър каширане

И в този случай ще работим с файла .htaccess, за да настроим дължините на каширането за браузъри, за да запазват изображения и външни скриптове. Този път ще посочим браузърите да запазват елементите за 7 дни. Запомнете, че това ще усложни програмирането на магазина, така че ако правите много промени в сайта е желателно да приключите с тях преди да прилагате този съвет.
Виждате кодът, който да поставите под последната част, която сме добавили

## EXPIRES CACHING ##
ExpiresActive On
ExpiresByType image/jpg "access plus 1 week"
ExpiresByType image/jpeg "access plus 1 week"
ExpiresByType image/gif "access plus 1 week"
ExpiresByType image/png "access plus 1 week"
ExpiresByType text/css "access plus 1 week"
ExpiresByType application/pdf "access plus 1 week"
ExpiresByType text/x-javascript "access plus 1 week"
ExpiresByType application/x-shockwave-flash "access plus 1 week"
ExpiresByType image/x-icon "access plus 1 week"
ExpiresDefault "access plus 1 week"
## EXPIRES CACHING ##


Тук скоростта на Opencart е значително повишена!

Въздействие: Високо
С прилагането на този съвет страниците ще се зареждат много бързо.

Съвет за ускоряване 4: Позволете поддържане Keep Alive за множество HTTP заявки

В тази част ще позволим на браузърите да изпращат множество HTTP заявки. По подразбиране, браузърът изпраща заявка за един файл, след това изчаква за отговор и прекъсва връзката преди да отвори следващия. Очевидно при наличието на много файлове този процес е бавен, както е случаят с OprenCart. Идеята на този съвет е да позволим на браузърите да улавят повече от един файл наведнъж, като позволим Keep-Alive опцията .
За целта трябва да работим с файловете в Web Server и да сме сигурни, че необходимият модул е достъпен. В противен случай ще получим грешка 500 server error. За целта влезте в сървъра в:  etc/httpd/conf/httpd.conf (в случая предполагаме, че работите с Apache сървър). Отворете файла и проведете търсене за “Keep”, което ще ви отведе в правилната част във файла. Бъдете сигурни, че стойностите са както посечените по-долу:

KeepAlive On
MaxKeepAliveRequests 50
KeepAliveTimeout 7


Забележка: Ако предпочитате да не извършвате промените сами, свържете се с вашия уеб хост, изпратете им линк към тази страница и уточнете, че трябва да настроите KeepAlive според указанията на Съвет 4 за ускоряване.
Следващата стъпка е да отворите вашия .htaccess файл и добавете следния код под посочените в таблицата. След това го запазете.

<ifModule mod_headers.c>
Header set Connection keep-alive
</ifModule>


Резултата след четвъртата модификация на Опънкарт

Въздействие: Средно
Въпреки, че скоростта за зареждане на страниците е същата в този експеримент, практиката показва, че тя съществено се увеличава, когато настройките Keep-Alive са включени. Винаги проверявайте дали сървърът е съвместим. В противен случай ще получите грешка 500.

Съвет за ускоряване 5: Заредете Javascript асинхронизирано

При нормално зареждане на OpenCart обикновено първо се „улавят” различни външни файлове, JavaScript файлове и се зарежда цялото съдържание на страницата. Всъщност не всичко това е необходимо. В идеалният вариант сайтът трябва първо да зарежда целия HTML и стил и чак след това да зарежда JavaScript, защото той не е нужен за структурата на страниците. Идеята на този съвет е да осигурите зареждането на съдържанието на страниците преди JavaScript файловете. За целта ще добавим много малък параметър във всеки <script> таг за страницата. За щастие, повечето от файловете се зареждат в header.tpl файла, затова влезте в FTP програма по ваш избор и:

catalog/view/theme/[YOUR THEME]/common/header.tpl

Отворете файла в текстов едитор и проведете бързо търсене за “.js” (без кавичките), за да намерите всички JavaScript файлове и просто добавете думата async след <script>. Например:

<!–Изглед по дефолт–>
<script type=“text/javascript“ src=“catalog/view/javascript/common.js“></script>
<!–Изглед след промяната–>
<script async type=“text/javascript“ src=“catalog/view/javascript/common.js“></script>

След като сте направили това за всички JavaScript файлове (те са около 5 на брой) успешно ще предотвратите забавянето на зареждането на страниците. Те ще се заредят след останалото съдържание. Какво показва тестът за скоростта?
Ние успяхме да докараме резултат от 90% / 92% !

Ефектът върху скоростта е значителен. Приема се, че е приоритет за оптимизиране на скоростта за вашия OpenCart магазин или, че това е препоръка от Google. Вероятно по-голям ефект от този съвет ще се получи при сайт с много изображения.
Сайта, който тествахме е с приблизително 600 продукта.
Сайта е тестван с http://gtmetrix.com / Source

The post Как да увеличите скоростта на вашия OpenCart магазин appeared first on Изработка на онлайн магазин | elenkov.net.