قدم به قدم افزایش سرعت سایت وردپرسی شما

برترین راهکارهای موجود برای افزایش سرعت سایت وردپرسی

چرا سرعت سایت مهم است؟

چند وقت پیش من توانستم سرعت سایت وردپرس خود را در کمتر از ۲ ساعت بهینه کنم، این کار را با نصب تعداد انگشت شماری از افزونه ها و رفع چند خطای ساده انجام دادم به طوری که سرعت بارگذاری وب سایت از ۱٫۶۱ ثانیه به ۵۸۳ میلی ثانیه بهبود یافت!!! که میزان این بهبود چیزی حدود ۷۰٫۳۹% بوده است، البته بدون هیچ گونه تغییر ظاهری در طراحی پوسته وب سایت.

با توجه به مطالعات Akamai در سال ۲۰۰۹، ۴۷% از بازدید کنندگان انتظار یک صفحه برای بارگذاری در کمتر از ۲ ثانیه،  و ۵۷% از بازدید کنندگان انتظار یک صفحه برای بارگذاری در ۳ ثانیه را داشته اند. این مطالعات ثابت کرده اند که سرعت بارگذاری صفحه ارتباط مستقیمی با فروش دارند.

در سال ۲۰۰۶، شرکت آمازون گزارش داده است که یک افزایش ۱۰۰ میلی ثانیه ای در سرعت بارگذاری صفحه موجب افزایش ۱درصدی در درآمد آن سازمان شده است. فقط چند سال بعد گوگل اعلام کرد که سرعت بارگذاری صفحه در رتبه بندی نتایج جستجو تاثیر خواهد داشت.

 

در ادامه ۱۲ روش که به طور چشمگیر در سرعت بارگذاری صفحه های سایت موثر هستند، که به ۴ عامل اصلی بستگی دارند را شرح می دهیم:

۱- شناسایی افزونه هایی که باعث کاهش سرعت وب سایت شما شده اند.

۲- فشرده سازی خودکار صفحات وب، تصاویر، جاوا اسکریپت و فایل های CSS.

۳- پاکسازی و بهینه سازی پایگاه داده.

۴- راه اندازی ذخیره سازی مرورگر برای وب سایت.

ذخیره سازی پایه

هنگامی که خانه شما در حال فرو ریختن است، احتمالا اقدام به تمیزکردن پنجره نمی کنید، بلکه شروع به تعمییر پایه های خانه خود می کنید. وب سایت شما نیز به همین شکل می باشد، اگر سایت خود را بر روی یک میزبانی وب ضعیف قرار داده اید و یا از پوسته های بی کیفیت استفاده کرده اید، باید شروع به تعمییر پایه های اصلی وب سایت خود یعنی انتخاب میزبانی وب معتبر و انتخاب یک پوسته استاندارد برای وب سایت خود کنید.

انتخاب یک میزبان خوب

در بین موارد مهم مربوطه، شرکت میزبانی وب و بسته های میزبانی وب تاثیر زیادی بر سرعت وب سایت شما دارند، من در گذشته جذب شرکت های میزبانی وب ارزان قیمت و یا رایگان میشدم، اما با تجربه بیشتر آموخته ام که میزبانی وب به موقعیت و سوابق آن شرکت بستگی دارد.

برای مثال ۲ نفر از مشتریان من وب سایت های خود را بر روی شرکت های میزبانی وب مختلفی قرار دادند. یکی بر روی هاست های شرکت WPEngine (شرکت قدرتمند در میزبانی وب) و دیگری بر روی هاست های اشتراکی ارزان قیمت قرار داد.

زمان پاسخ DNS (یعنی مدت زمانی که طول میکشد مرورگر به سرور میزبانی وب متصل شود). آن مشتری که از سرور WPEngine استفاده کرد زمان پاسخ DNS فقط ۷ میلی ثانیه بود. در حالی که مشتری دیگر که از سرورهای اشتراکی ارزان قیمت استفاده می کرد چیزی در حدود ۲۵۰ میلی ثانیه زمان صرف میشد!!!

انتخاب پوسته خوب و با کیفیت

متاسفانه تمامی پوسته های وردپرس با یکدیگر برابر نیستند. در حالی که برخی از پوسته ها بسیار خوب و استاندارد می باشند، برخی دیگر با استفاده از ویژگی های پر زرق و برق بسیار کند و سنگین عمل میکنند. چندی پیش یکی از دوستان بنده با تغییر پوسته وب سایت خود توانست که مدت زمان بارگذاری وب سایت خود را از ۶۳۰ میلی ثانیه به ۱۷۲ میلی ثانیه برساند.

قبل از انتخاب یک پوسته بهتر است که دموی آن را با استفاده از ابزارهای تست سرعت مانند Pingdom، آنالیز کنید تا مطمئن شوید که پوسته مورد نظر شما بدون هیچ چیز اضافه و با سرعت مناسبی بارگذاری می شود.

استفاده از شبکه های تحویل محتوا (CDN)

من به تازگی برای وب سایت های خود از شبکه های تحویل محتوا (CDN) استفاده میکنم و شاهد کاهش مصرف ۵۵% از پهنای باند و همچنین سرعت بالا در بارگذاری صفحه های سایت خود شده ام.

CDN یک شبکه بزرگ در سرتاسر جهان است که فایل های شما را در خود قرار می دهد، که اگر کاربری از کشور آرژانتین وارد سایت شما شود فایل های شما از نزدیکترین سرور از لحاظ جغرافیایی به آن کاربر ارسال می گرددو از آنجایی که پهنای باند شما در سرتاسر جهان پخش می شود، بار مصرفی از هاست شما نیز کاهش می یابد.

راه اندازی یک CDN می تواند چندین ساعت طول بکشد، اما معمولا یکی از سریعترین راه ها برای افزایش سرعت بارگذاری صفحه های وب سایت شما می باشد.

۱۲ راه حل سریع برای افزایش سرعت سایت وردپرسی:

حالا که پایه و اساس کار را میدانید می توانید شروع به تنظیم وب سایت خود کنید.

برای شروع ببینید که وب سایت شما چه چیز اضافه ای دارد؟ معمولا کاهش سرعت سایت به دلیل وجود ویژگی های اضافی در آن می باشد تا اینکه چیزی را کم داشته باشد.

۱شناسایی افزونه هایی که سرعت سیستم را کاهش می دهند

P3 پلاگین مورد علاقه من برای تشخیص افزونه هایی است که در زمان بارگذاری صفحه اجرا می گردند. این به شما کمک میکند تا متوجه شوید که چه افزونه هایی به صورت قطره قطره از سرعت سایت شما کم کرده اند.

 

در بیشتر مواقع کاهش سرعت به دلیل وجود پلاگین های اشتراک گذاری در شبکه های اجتماعی است، برای جلوگیری از این کاهش سرعت می توانید از کدهای مستقیم برای اتصال به شبکه اجتماعی استفاده کنید.

هنگامی که شما آمار آنالیز آنها را مطالعه کردید می توانید تصمیم بگیرید که آیا لزم است از آن افزونه ها استفاده کنید یا نه!

۲فشرده سازی وب سایت شما

هنگامی که شما بر روی سیستم عامل خود فایلی را در پوسته ZIP فشرده سازی میکنید متوجه کاهش حجم آن فایل می شوید و می توانید با سرعت بیشتری آن را برای کسی ارسال کنید. از GZIP دقیقا برای همین کار در صفحات وب استفاده می گردد.

پس از نصب GZIP وب سایت شما به صورت خودکار شروع به فشرده سازی صفحات وب سایت شما می کند، که در نتیجه باعث کاهش پهنای باند و افزایش سرعت بارگذاری می گردد، و هنگامی که کاربری از وب سایت شما بازدید می کند مرورگر آن به صورت خودکار فایل ها را از حالت فشرده شده خارج می نماید و به کاربر نمایش می دهد، که در زمان بارگذاری صفحه بسیار صرفه جویی می گردد.

 

عملا هیچ نوع نزول سرعتی در عملکرد GZIP وجود ندارد همانطور که دز تصویر بالا که از سایت MusicLawContracts.com مشاهده میکنید، حجم فایل ها از ۶۸KB به ۱۳KB کاهش یافته است.

در حالی که افزونه های زیادی برای GZIP کردن سایت وجود دارد، شما می توانید به سادگی خودتان این عمل را بدون افزونه انجام دهید. برای اینکار با بازکردن فایل .htaccess و قرار دادن قطعه کد زیر در آن این امکان را فرهم می سازید:

.htaccess

۱

۲

۳

۴

۵

۶

۷

۸

۹

۱۰

<ifModule mod_gzip.c>

mod_gzip_on Yes

mod_gzip_dechunk Yes

mod_gzip_item_include file .(html?|txt|css|js|php|pl)$

mod_gzip_item_include handler ^cgi-script$

mod_gzip_item_include mime ^text/.*

mod_gzip_item_include mime ^application/x-javascript.*

mod_gzip_item_exclude mime ^image/.*

mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*

</ifModule>

 

۳فشرده سازی تصاویر

بیشترین پهنای باند را تصاویر وب سایت ها مصرف می کنند. WP Smush.it یکی از چندن افزونه ای است که بصورت خودکار تصاویر را فشرده و در کتابخانه وردپرس قرار می دهد. این فشرده سازی را با “lossless,” انجام می دهد، به این معنی که هیچ تاثیری در کیفیت تصاویر رخ نمی دهد.

یکی دیگر از ویژگی های خوب افزونه WP Smush.it این است که پس از نصب این افزونه اگر هزاران عکس در کتابخانه وردپرس خود دارید می توانید همه آنها را بهینه سازی کنید.

۴ذخیره سازی مرورگر (BROWSER CACHING)

ذخیره مرورگر یک مسئله پیچیده است. تعداد انگشت شماری از افزونه ها کار ذخیره سازی بر روی مرورگر را می توانند انجام دهند.

این عمل به این صورت است که به مرورگر یا سرور دستور می دهد که تا تاریخ انقضای مشخصی فایل های خاصی را بر روی خود ذخیره کنند، البته این روش زمانی عملی میشود که کاربر حداقل یک بار از سایت بازدید کرده باشد و مرورگر آن از سایت کش ذخیره کرده باشد.

تاریخ انقضا از دو طریق باعث افزایش سرعت سایت می گردد. اول اینکه فایل ها بر روی سرور و یا مرورگر تا تاریخ انقضای خاصی باقی می مانند و در هنگام بازدید دوباره کاربر دسترسی به آنها سریعتر خواهد بود. دوم اینکه تعداد درخواست هایی که از HTTP می شود را کاهش می دهد.

برای انجام این کار به شما افزونه WP Super Cache را پیشنهاد می کنم، پس از نصب این افزونه مطمئن شوید که تنظیمات را به درستی انجام داده اید.

همچنین شما می توانید از طریق قطعه کد زیر خودتان این کار را انجام دهید، کافیست کدهای زیر را به فایل .htaccess اضافه کنید:

.htaccess

۱

۲

۳

۴

۵

۶

۷

۸

۹

۱۰

۱۱

۱۲

۱۳

۱۴

۱۵

۱۶

۱۷

۱۸

۱۹

۲۰

۲۱

۲۲

۲۳

۲۴

۲۵

۲۶

۲۷

۲۸

۲۹

۳۰

۳۱

۳۲

۳۳

۳۴

# BEGIN Expire headers

<ifModule mod_expires.c>

ExpiresActive On

ExpiresDefault “access plus 5 seconds”

ExpiresByType image/x-icon “access plus 2592000 seconds”

ExpiresByType image/jpeg “access plus 2592000 seconds”

ExpiresByType image/png “access plus 2592000 seconds”

ExpiresByType image/gif “access plus 2592000 seconds”

ExpiresByType application/x-shockwave-flash “access plus 2592000 seconds”

ExpiresByType text/css “access plus 604800 seconds”

ExpiresByType text/javascript “access plus 216000 seconds”

ExpiresByType application/javascript “access plus 216000 seconds”

ExpiresByType application/x-javascript “access plus 216000 seconds”

ExpiresByType text/html “access plus 600 seconds”

ExpiresByType application/xhtml+xml “access plus 600 seconds”

</ifModule>

# END Expire headers

 

# BEGIN Cache-Control Headers

<ifModule mod_headers.c>

<filesMatch “.(ico|jpe?g|png|gif|swf)$”>

Header set Cache-Control “public”

</filesMatch>

<filesMatch “.(css)$”>

Header set Cache-Control “public”

</filesMatch>

<filesMatch “.(js)$”>

Header set Cache-Control “private”

</filesMatch>

<filesMatch “.(x?html?|php)$”>

Header set Cache-Control “private, must-revalidate”

</filesMatch>

</ifModule>

# END Cache-Control Headers

 

۵– بهینه سازی پایگاه داده

من از طرفدار های بزرگ وردپرس هستم و یکی از ویژگی هایی که مرا خیلی مجذوب این CMS می کند، سیستم ذخیره سازی خودکار (autosaves) آن است. اما ایراد این کار اینجاست که ممکن است وردپرس هزاران ذخیره را در پایگاه داده خود قرار دهد.

برای حل مشکل فوق بنده به شما افزونه WP-Optimize را پیشنهاد می کنم. که بطور معمول وظیفه آن بهینه سازی و حذف اطلاعات اضافی پایگاه داده است

۶بهینه سازی فایل های CSS و جاوا اسکریپت

اگر شما بیش از ۱۰ یا ۲۰ افزونه بر روی وردپرس خود نصب کرده باشید این احتمال را دارد که ده ها فایل CSS و JS در هر صفحه بارگذاری شود که این اصلا خوب نیست. بهتره که تمامی فایل های CSS یا JS در یک فایل ذخیره و اجرا شوند.

در اینجا باید از minification استفاده کنید. افزونه ای مانند Better WordPress Minify تمامی فایل های CSS و JS را یکپارچه می کند و باعث کاهش درخواست ها از HTTP می گردد.

۷– غیرفعال کردن بازتاب ها

بازتاب ها در وردپرس روشی برای مطلع کردن دیگر وبلاگ ها از این که لینک سایت آنها را استفاده کرده اید. در حالی که ممکن است خیلی کم از این امکان استفاده شود و به همین صورت باعث کاهش سرعت وب سایت شما می گردد. برای غیر فعال کردن این حالت می توانید از منوی “تنظیمات” از قسمت “گفتگوها” گذینه “کوشش برای آگاه کردن ‌همه‌ی وبلاگ‌هایی که پیوندشان در ‌این نوشته است” و گذینه ” پذیرفتن بازتاب از دیگران (بازتاب فرستادن)” غیر فعال کنید.

۸تعیین سایزهای تصویر و تعداد کاراکترهای مورد استفاده

قبل از اینکه مرورگر صفحه وب سایت را به بازدید کنندگان نشان دهد باید تصویر را نسبت به نوشته های اطراف آن تنظیم کند و به نمایش بگذارد که کار مشکل و زمان بری می باشد.

مشخص کردن ابعاد تصویر به مرورگر کمک می کند تا بتواند در سریعترین زمان ممکن تصاویر را در کنار نوشته ها قرار دهد و به نمایش بگذارد. همچنین بهتر است که تعداد کارمتر های قابل نمایش نوشته را برای مرورگر مشخص نمایید تا از اجرای کارکتر های اضافه تر جلوگیری شود.

۹- قراردادن فایل های CSS در بالا و فایل های JAVASCRIPT در پایین سایت

قراردادن لینک معرفی فایل های CSS بالای سایت به این دلیل توصیه می گردد که هنگام بارگذاری صفحه، مرورگر از بالا به پایین کدهای پوسته را اجرا می کند و همچنین کدهای جاوا اسکریپت بهتر است که در پایین سایت مورد استفاده قرار بگیرد. زیرا هنگام بارگذاری فایل های جاوا اسکریپت زمان زیادی مصرف میگردد.

در بعضی موارد رفع موارد ساده ای مانند بهینه کردن فایل ها موجب میگردد که مرورگر سریعتر و راحتر بتواند فایل ها را دانلود کند. در بعضی از وب سایت هایی که به شدت از فایل های جاوا اسکریپت استفاده میکنند و باید قبل از هر چیز آنها دانلود شوند ممکن است مرورگر را برای بازگذاری سریعتر صفحه دچار مشکل کند.

۱۰استفاده از CSS SPRITES

SPRITES یک تصویر بزرگ از تمامی تصاویر مورد نیاز پوسته است، به این شکل که تمامی تصاویر مورد نیاز که در جای جای پوسته استفاده می شوند همگی در پوسته یک تصویر بار گذاری شده و سپس از طریق دستورات CSS با استفاده از مختصات تصویر با جایگاه خود هماهنگ می شوند.

CSS SPRITES به وب سایت شما سرعت می بخشد چرا که بارگذاری یک تصویر بزرگ سریع تر از بارگذاری چندین تصویر کوچک است.

ساده ترین راه استفاده از ابزار  SpriteMe است که تصاویر را در پوسته یک فایل CSS قرار می دهد.

۱۱فعالسازی KEEP ALIVE

طور خلاصه، Keep Alive ارتباط بین سرور و مرورگر اینترنت است که می‌گوید “شما می‌توانید بیش از یک فایل را بگیرید.” مرورگر، برای نشان دادن صحیح صفحا ت وب‌ سایت ما باید همه فایل‌ها را دریافت نماید. اگر مرورگر و سرور مجبور باشند برای دریافت همه فایل‌ها هر بار مجبور به ارسال درخواست و دریافت مجوز باشند، زمان زیادی
برای دریافت تمام فایل‌ها تلف خواهد شد. در این‌ گونه موارد سرور می‌تواند به مرورگر بگوید که “هر چه فایل نیاز داری را دریافت کن.” وقتی مرورگر می‌خواهد یک صفحه را نشان دهد، باید اول فایل HTML را دریافت کند. سپس مرورگر فایل HTML را خوانده و فایل‌های بیشتری را درخواست می‌کند که توسط HTML فراخوانی شده‌اند. مثل CSS یا عکس یا هر چیزی دیگر که فایل HTML درخواست می‌کند. وقتی Keep Alive فعال نده باشد، این‌کار می‌تواند زمان زیادی نیاز داشته تا مرورگر بتواند صفحه را دانلود کند. صفحا ت وب، معمول مجموعه‌ای از تعداد زیادی فایل بوده و اگر بنا باشد که هر کدام از این فایل‌ها نیاز به یک ارتباط مستقل و مستقیم داشته باشند آن وقت زمان بسیار زیادی تنها صرف نمایش یک صفحه می‌شود که از دید کاربران سایت بسیار نامناسب است. در واقع تعریف رسمی Keep Alive HTTP چنین است: “روشی که اجازه می‌دهد مکالمه HTTP در کانکشن Tcp به جای باز کردن درخواست جدید، هر چه فایل می‌خواهد دریافت کند.”

برای فعال سازی Keep Alive کافی است که قطع کد زیر را در فایل .htaccess وب سایت خود قرار دهید:

.htaccess

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

 

۱۲– جایگزین کدهای PHP با کدهای HTML استاتیک در مواقع مناسب

استفاده از کدهای PHP برای سایت های بزرگ باعث میگردد که که قسمت های استاتیک و تکرار شونده سایت با استفاده از کدهای PHP کوتاه تر شوند.

 

نتیجه گیری:

در ۱۲ ماه آینده با توجه به سیر پیشرفت اینترنت تلفن همراه پیش بینی می شود که کاربران تلفن همراه نسبت به کاربران دسکتاپ بیشتر می شوند، به همین دلیل سرعت وب سایت یکی از مهم ترین عوامل موفقیت یک وب سایت خواهد بود