Web Analytics Made Easy - StatCounter
Главная Блог Ускорение веб-сайта Laravel - шаг за шагом

Ускорение веб-сайта Laravel - шаг за шагом

Ускорение веб-сайта Laravel - шаг за шагом

Введение

Из-за популярности Laravel Framework создание отличного веб-сайта или веб-приложения с Laravel растет день ото дня. Laravel - отличный выбор для создания веб-приложений. Дело в том, что это не CMS, такая как WordPress, Drupal, Joomla и т. д. Поэтому мы не можем получить готовые плагины для улучшения нашего приложения laravel всего за несколько кликов, но Laravel имеет так много функций оптимизации скорости из коробки для ускорения вашего сайта. или веб-приложение.

Если вы ищете пошаговое руководство по увеличению скорости веб-сайта, то оно для вас. В этом посте я покажу вам полное пошаговое руководство по увеличению скорости и производительности страницы вашего laravel-сайта.

Шаги по увеличению скорости веб-сайта Laravel

  • HTML-минификация
  • Кеширование маршрута
  • Кеширование запросов
  • Кэширование конфигурации
  • Объединение и минимизация CSS / Js
  • Оптимизировать изображения
  • Нетерпеливая загрузка
  • Оптимизация htaccess
  • Более быстрый сервер веб-хостинга
  • Используйте CDN

Примечание: перед выполнением этих шагов вы можете протестировать текущий тест скорости страницы веб-сайта laravel с помощью скорости страницы Google, GT Metrix или Pingdom, после чего вы можете сравнить улучшение до и после.

1. Минификация HTML

Во время разметки HTML мы оставляем много пробелов для отступов и повышения читабельности кода. Браузер не заботится о пробелах и отступах, но они делают наш HTML-файл больше и влияют на скорость страницы. Мы можем легко уменьшить размер HTML-страницы, объединив HTML с помощью промежуточного программного обеспечения Laravel. Давайте сделаем модификацию HTML с помощью промежуточного программного обеспечения laravel.

Запустите команду, чтобы HTML минимизировал промежуточное программное обеспечение, и выполните код в промежуточном программном обеспечении для унификации запроса HTML на странице.

php artisan make:middleware HtmlMinifierCopy 
<?php namespace App\Http\Middleware; use Closure; use Illuminate\Http\Response; class HtmlMinifier { public function handle($request, Closure $next) { $response = $next($request); $contentType = $response->headers->get('Content-Type'); if (strpos($contentType, 'text/html') !== false) { $response->setContent($this->minify($response->getContent())); } return $response; } public function minify($input) { $search = [ '/\>\s+/s', '/\s+</s', ]; $replace = [ '> ', ' <', ]; return preg_replace($search, $replace, $input); } } 

Добавьте промежуточное ПО в файл kernel.php в массив $routeMiddlewareGroup.

protected $routeMiddleware = [ ..., ..., 'HtmlMinifier' => '\App\Http\Middleware\HtmlMinifier', ] 

Теперь мы можем использовать это промежуточное ПО в нашем файле маршрута. Для каждого запроса на нашем сайте это промежуточное ПО автоматически модифицирует HTML и отвечает пользователю.

Route::group(['middleware'=>'HtmlMinifier'], function(){ Route::get('/', 'SiteController@home'); Route::get('/{slug}', 'SiteController@postDetails'); ... ... }); 

2. Кеширование маршрута

Мы можем получить большую скорость запроса-ответа, используя кеширование маршрутов Laravel. Чтобы сделать кеширование маршрутов, выполните приведенную ниже команду.

php artisan route:cache 

Эта команда кэширует все маршруты в файл routes.php в каталоге bootstrap / cache. Если вам нужно добавить новый маршрут позже или отредактировать, вам придется очистить кеш маршрута и заново сгенерировать его.

php artisan route:clear 

3. Кеширование запросов

Предположим, у нас есть 50 сообщений в блоге на нашем сайте, и каждый день на наш сайт заходят 1 тысяча посетителей. В этой ситуации всякий раз, когда посетитель читает сообщение, он попадает в базу данных для содержания сообщения и требует времени, что является еще одним фактором медленного запроса, и ваш сайт становится немного медленнее. Мы можем легко решить эту проблему, закешировав наш пост. Когда любой пользователь прочитает сообщение в блоге, оно будет сохранено в нашем кеше, а затем для любого посетителя сообщение будет обслуживаться из нашего кеша, а не попадать в нашу базу данных. Так что больше никаких запросов к базе данных и более быстрый ответ. Это круто! Давайте сделаем это.

// example.com/awesome-post-title public function postDetails($slug){ $post = Cache::rememberForever('posts.'.$slug, function($slug) use($slug) { return Post::where('slug',$slug)->first(); }); return view('frontend.posts.post-details',['post'=>$post]); } 

Послушайте, я передаю ярлык сообщения, который уникален для каждого сообщения для URL-адреса, оптимизированного для SEO. Вы можете прочитать этот пост, чтобы узнать больше о создании URL-адресов, оптимизированных для SEO.

Перестаньте думать: вы можете подумать, что если мы обновим какое-либо сообщение, наш посетитель все равно получит старый контент из кеша. Это верно, но мы можем легко исправить это с помощью небольшого кода в нашей модели для управления кешем во время пост-обновления и удаления. Давайте добавим метод загрузки в модель поста.

<?php namespace App; use Illuminate\Database\Eloquent\Model; class Post extends Model { public static function boot() { parent::boot(); static::updating(function ($instance) { // update cache content Cache::put('posts.'.$instance->slug,$instance); }); static::deleting(function ($instance) { // delete post cache Cache::forget('posts.'.$instance->slug); }); } } 

4. Кэширование конфигурации

На нашем веб-сайте laravel внутри каталога config сохраняется вся конфигурация. Laravel анализирует все файлы для чтения значения конфигурации во время выполнения. Мы можем легко оптимизировать скорость, сделав кеш конфигурации. Чтобы сделать кеширование конфигурации в laravel, выполните приведенную ниже команду.

php artisan config:cache 

Эта команда кэширует всю вашу конфигурацию в файл config.php в каталоге bootstrap / cache. Если вам нужно добавить дополнительную конфигурацию позже или изменить, вам необходимо очистить config-cache и заново сгенерировать его. Чтобы очистить кеш конфигурации, выполните приведенную ниже команду.

php artisan config:clear 

5. Объединение и минимизация CSS/Js-файлов

На каждом сайте есть много файлов CSS / JS, и каждый раз браузер делает HTTP-запрос для каждого файла CSS / JS. Подумайте, если на нашем сайте есть 20-25 разных ссылок на файлы CSS / Js, тогда он будет делать больше HTTP-запросов к нашему серверу для загрузки ресурсов, и это еще один фактор, более медленный для сайта. Мы можем создать пакет для CSS и минимизировать файлы CSS и файл Js для удаления лишних пробелов и отступов с помощью Webpack, Gulp, Grunt или любых других инструментов сборщика. Это поможет нам объединить весь файл CSS в один файл, а все файлы Js - в один файл пакета js. Теперь мы помогаем нам, уменьшая количество HTTP-запросов, и сайт загружается быстрее, чем раньше. Вот пример микса laravel.

//css bundle mix.styles([ 'public/css/vendor/bootstrap.min.css', 'public/css/style.css' ], 'public/bundle/app.css'); //js bundle mix.scripts([ 'public/js/vendor/jquery-2.1.4.js', 'public/js/vendor/bootstrap.min.js', 'public/js/functions.js' ], 'public/bundle/app.js'); 
npm run production 

Теперь свяжите файлы app.css и app.js в шаблоне вашего сайта вместо добавления каждого файла CSS и js.

6. Оптимизируйте изображения

Изображение очень важно для каждого веб-сайта. Требуется больше байтов, чем текстового содержимого. Мы должны знать об использовании изображения и его формате. Изображения больше влияют на отчеты о скорости загрузки страниц Google. Мы можем использовать TinyPng, Cloudinary, Squoosh, чтобы получать более оптимизированные изображения для нашего веб-сайта. Оптимизированные изображения могут сэкономить пропускную способность нашего сайта, а также быстро загрузить наш сайт.

Мы можем лениво загружать изображения на наш сайт. Это полезный метод, потому что с помощью этого метода загружаются только изображения, которые в настоящее время видны в области просмотра. Когда пользователь прокручивает страницу, он загружает остальные изображения, поэтому веб-страница загружается быстрее. Чтобы реализовать ленивую загрузку изображения, просто добавьте атрибут lazy = "loading" в свой тег img.

7. Нетерпеливая загрузка

Нетерпеливая загрузка очень эффективна для загрузки данных из базы данных с меньшим объемом операций с базой данных. Это решает проблему запроса N + 1. Получение желаемых данных с меньшим взаимодействием с базой данных с оптимизированным выполнением запросов очень полезно для повышения производительности сайта или веб-приложения. Посмотрим на пример.

Предположим, у нас есть модель публикации, и она имеет отношение «один-много» с моделью комментариев.

class Comment extends Model { public function post() { return $this->belongsTo(Post::class); } } class Post extends Model { public function comments() { return $this->hasMany(Comment::class); } } 

Без нетерпеливой загрузки

Теперь, если мы запустим цикл для красноречивой коллекции Post, за кулисами он выполнит запрос N + 1 без активной загрузки, что убивает производительность, если коллекция такая большая.

$posts = Post::all(); foreach ($posts as $post) { echo $post->name; $comments = $post->comments; foreach($comments as $comment){ // do something } } 

Этот код генерирует N + 1 и взаимодействие с базой данных. Если в нашей таблице сообщений 100 сообщений, она сгенерирует 100 + 1 запросов. 1 для получения сообщений из таблицы сообщений и еще 100 запросов для каждого комментария к публикации.

# query for N number of post SELECT * FROM posts; # For each N post it will run also SELECT * FROM comments WHERE post_id = 1 SELECT * FROM comments WHERE post_id = 2 SELECT * FROM comments WHERE post_id = 3 ..... 

С нетерпеливой загрузкой

Now if we use Eager loading feature then it will run an optimized query for us.

$posts = Post::with('comments')->get(); foreach ($posts as $post) { echo $post->name; $comments = $post->comments; foreach($comments as $comment){ // do something } } 

Теперь при активной загрузке он выполнит только два запроса, как показано ниже.

# First query SELECT * FROM posts; # Second query SELECT * FROM comments WHERE post_id IN (1, 2, 3, 4, 5, ...); 

8. Оптимизация htaccess

Оптимизация Laravel htaccess может помочь в увеличении скорости страницы вашего веб-сайта за счет кэширования изображений, сжатия HTML, сжатия Gzip, включения кэширования браузера, истечения срока действия заголовков для использования кеширования браузера. Откройте файл htaccess и добавьте приведенный ниже фрагмент кода в конец своего сайта.

Файл .htaccess очень важен для сервера и очень сильно влияет на ваш веб-сервер Linux. Перед любыми изменениями сначала сохраните резервную копию.

## EXPIRES CACHING ## <IfModule mod_expires.c> ExpiresActive On ExpiresByType image/jpg "access 1 year" ExpiresByType image/jpeg "access 1 year" ExpiresByType image/gif "access 1 year" ExpiresByType image/png "access 1 year" ExpiresByType text/css "access 1 month" ExpiresByType application/pdf "access 1 month" ExpiresByType application/javascript "access 1 month" ExpiresByType application/x-javascript "access 1 month" ExpiresByType application/x-shockwave-flash "access 1 month" ExpiresByType image/x-icon "access 1 year" ExpiresDefault "access 2 days" </IfModule> # GZIP COMPRESSION # compress text, html, javascript, css, xml: AddOutputFilterByType DEFLATE text/plain AddOutputFilterByType DEFLATE text/html AddOutputFilterByType DEFLATE text/xml AddOutputFilterByType DEFLATE text/css AddOutputFilterByType DEFLATE application/xml AddOutputFilterByType DEFLATE application/xhtml+xml AddOutputFilterByType DEFLATE application/rss+xml AddOutputFilterByType DEFLATE application/javascript AddOutputFilterByType DEFLATE application/x-javascript # compress HTML <files *.html> SetOutputFilter DEFLATE </files> # GZIP COMPRESSION 

9. Более быстрый сервер веб-хостинга

Сделав все, мы должны развернуть наш веб-сайт на веб-хостинге. Более быстрый веб-сервер имеет большое значение для быстрого обслуживания веб-страниц для вашего посетителя. Поэтому мы должны помнить об этом факте. Выберите для своего веб-сайта VPS или выделенный сервер веб-хостинга, если это доступно для вас, или используйте хороший виртуальный хостинг. Вы должны быть очень обеспокоены выбором веб-хостинга для своего сайта. Чтобы получить надежный веб-хостинг для вашего сайта по разумной цене, вы можете выбрать одного из хостинг-провайдеров, указанных ниже.

  • Vultr - Надежный VPS начинается с 2,50 долларов США только с бесплатным кредитом в размере 100 долларов США!
  • DigitalOcean - Бесплатный кредит в размере 100 долларов США на 60 дней
  • Amazon Lightsail
  • Bluehost
  • Namecheap

10. Используйте CDN

Если у вашего сайта высокий трафик из другого региона, используйте CDN (сеть доставки контента). Он будет доставлять контент на ваш сайт с малой задержкой в ​​сети. Вкратце, предположим, что у вас есть веб-сайт и его хост-сервер находится в США, а вы - посетители из США, и большинство посетителей из Европы и Азии. Для пользователей, которые находятся далеко от вашего сервера, время загрузки веб-сайта увеличивается, потому что информация распространяется на большие расстояния, чтобы добраться до вашего посетителя. В этой ситуации вы можете использовать сервер CDN для посетителей из Европы и Азии, чтобы получить быструю доставку контента веб-сайта. Если вы хотите использовать CDN для своего веб-сайта, это может быть лучшим вариантом для вас, приведенным ниже.

  • MaxCDN
  • Cloudflare

Я изо всех сил старался написать этот пошаговый процесс для создания сверхбыстрого оптимизированного веб-сайта на laravel, который поможет вам увеличить скорость вашего веб-сайта на laravel. Если вы правильно реализуете эти методы, вы увидите заметную производительность на своем веб-сайте, созданном на Laravel. Я надеюсь, что этот пост поможет вам узнать много трюков и техник, чтобы улучшить скорость вашего сайта и как увеличить скорость сайта laravel. Если этот пост был полезен для вас, поделитесь им с другими, чтобы им можно было помочь в создании сверхбыстрого веб-сайта на laravel!

Источники

Speed Up Laravel website - Step by Step