modirantarah
کاربر تازه وارد
چند مدت پیش من در حال آزمایش روی سرعت لود وب سایت وردپرس خودم بودم.
در کمتر از دو ساعت کار پس از نصب تعداد کمی افزونه و رفع چند خطای ساده ؛ سرعت لود وب سایت وردپرس خودم را از 1:30 ثانیه به 585 میلی ثانیه رساندم. می توان گفت سرعت لود سایت وردپرس من بدون انجام تغییرات بصری 70 % بهبود یافت .
با توجه به تحقیقات Akamai در سال 2009 , 47% از بازدید کنندگان برای لود یک سایت کمتر 2 ثانیه منتظر می مانند , و 57%بازدید کنندگان اگر سرعت لود صفحه ای بیش از 3 ثانیه طول بکشد ؛ آن صفحه را رها می کنند.
در سال 2006 آمازون اعلام کرد که یک افزایش 100 میلی ثانیه ای در لود ترجمه برگه ای از وب سایت , درآمد آن را 1%افزایش داد.
افزایش سرعت لود وب سایت
در زیر 11 راه برای بهبود سرعت لود وب سایت وردپرس گفته ام که می تواند زمان بارگزاری وب سایت شما را بطور چشمگیر بهبود بخشد. از جمله این روش ها:
- شناسایی افزونه هایی که سرعت لود وب سایت شما را کاهش می دهند.
- فشرده سازی صفحات وب، تصاویر، فایل های جاوا اسکریپت و CSS بطور خودکار.
- تمیز نگه داشتن بانک اطلاعاتی وب سایت وردپرس.
- راه اندازی صحیح کش مرورگر ها .
هنگامی که خانه ی شما کثیف و به هم ریخته است , شما ابتدا شروع به پاک کردن در و دیوار می کنید. همین حالت نیز در وب سایت شما وجود دارد . یعنی ابتدا باید وضیعت پایه ای را درست کرد.
اگر سرور و فضای میزبانی شما به هم ریخته است شما باید سریعا از پایه و اساس این مشکل را رفع کنید.
انتخاب یک هاست یا فضای میزبانی خوب
شرکت فضای میزبانی شما و همچنین بسته میزبانی وب سایت تاثیر بسیار زیادی بر سرعت وب سایت دارد.
برای مثال من برای دو تا از مشتریان خودم وب سایت هایی با امکانات کاملا مشابه طراحی کرده بودم, با این تفاوت که فضای میزبانی یکی از مشتریان از یک شرکت بسیار عالی بود و فضای میزبانی وب سایت دیگری از شرکت های ارزان قیمت تهیه شده بود . نتیجه این کار سرعت لود وب سایت شخصی که فضای میزبانی عالی داشت 7 میلی ثانیه بود , اما سرعت لود وب سایت مشتری با هاست ارزان قیمت 250 میلی ثانیه بود.
پس اگر می خواهید سرعت وب سایت خوبی داشته باشید, از فضای میزبانی شرکت های خوب و بسته ی میزبانی مناسب استفاده کنید.
انتخاب یک قالب خوب
متاسفانه همه ی قالب های وردپرس برابر ساخته نشده اند. برخی از قالب های وردپرس سریع هستند و خوب کد شده اند, اما برخی دیگر تمیز نیستند و بیشتر ظاهر زیبایی دارند.
مدتی پیش برروی قالبی کار می کردم که بسیار سنگین کار می کرد , تصمیم گرفتم قالب وب سایت را تغییر دهم , پس از تغییر قالب سرعت لود وب سایت از 630 به 173 میلی ثانیه تغییر کرد.
هنگامی که می خواهید برای وب سایت خود قالبی تهیه کنید , بهتر است حتما سرعت بارگزاری سایت را در نسخه پیش نمایش یا همان دمو با ابزار هایی مانند Pingdom بررسی کنید.
استفاده از شبکه های انتشار محتوا
من به تازگی برای یک وب سایت وردپرس از شبکه انتشار محتوا (CDN) استفاده کردم و متوجه شدم 55% از استفاده پهنای باند کاهش یافته است و سرعت لود وب سایت بهبود زیادی داشته است.
CDN فایل های شما را در شبکه ای بزرگ از سرور ها در سراسر جهان میزبانی میکند. بطور مثال اگر یک بازدیدکننده از آرژانتین بخواهد از سایت شما فایلی را دانلود کند , فایل ها از سروری دانلود خواهند شد که از نظر منقطه جغرافیایی به او نزدیک تر است. ازآنجا که پهنای باند شما در سراسر سرور های مختلف پخش شده است , بار فایل ها ؛ دیگر برروی یک سرور نیست و بار کمی برروی سرور های مختلف می باشد.
راه اندازی CDN ممکن است چند ساعت طول بکشد, اما معمولا یکی از راه هایی می باشد که سرعت لود وب سایت شما را بسیار بهینه خواهد کرد.
11 راه برای بهینه سازی سرعت لود وب سایت
اکنون که پایه و اساس وب سایت را درست کردیم , می توانیم شروع به تنظیم نمودن وب سایت کنیم.
1- شناسایی افزونه هایی که سرعت لود وب سایت را افزایش می دهند.
P3 یکی از افزونه های مورد علاقه ی من است , زیرا در هنگام لود وب سایت تاثیر افزونه های دیگر را به شما نشان می دهد. این موجب می شود شما براحتی افزونه هایی که سرعت لود وب سایت را افزایش می دهند را تشخیص دهید.
دانلود افزونه P3 برای افزایش سرعت لود وب سایت
معمولا افزونه های اشتراک گذاری شبکه های اجتماعی اکثرا سرعت لود برگه را کاهش می دهند. هنگامی که شما از افزونه های کم سرعت در وب سایت خود آگاه هستید , می توانید تصمیم بگیرید که آنها را جایگزین کنید و یا بطور کامل حذف کنید.
2- فشرده سازی وب سایت شما
هنگامی که شما در کامپیوتر خود فایل ها را فشرده سازی می کنید مثلا با ZIP کردن فایل , اندازه کل فایل کاهش می یابد, و ارسال آن فایل به کسی ساده تر و سریع تر می باشد. Gzip دقیقا همان کار را اما در برگه وب انجام می دهد.
پس از نصب Gzip فایل های وب سایت شما را به طور خودکار فشرده سازی می کند مانند فایل های ZIP, این موجب می شود در پهنای باند و سرعت لود وب سایت بهینه سازی شود. هنگامی که یک بازدید کننده وب سایت شما را مشاهده می کند , مرورگر به طور خودکار فایل ها را از حالت فشرده خارج کرده و مطالب شما را نشان می دهد. این روش انتقال مطالب از سرور به مرورگر است که به مراتب کار آمد تر است و موجب صرفه جویی در زمان می شود.
فشرده سازی فایل های وب سایت با Gzip
همانطور که در شکل بالا مشاهده می کنید با نصب و راه اندازی Gzip , MusicLawContracts.com از 68 کیلو بایت به 13کیلو بایت تبدیل شد.
به برخی از افزونه ها با Gzip یک دکمه اضافه خواهد شد , که نصب دستی آن بسیار ساده است. فایل .htaccess خود را باز کنید و کد زیر را به آن اضافه کنید:
کد:
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هنگامی که شما این قطعه کد را به .htaccess اضافه کردید , با اجرا Check Gzip Compression تست کنید که آیا Gzipبرروی وب سایت شما کار میکند. اگر به هر دلیلی کد بالا کار نکرد با استفاده از روش هایی که پاتریک سکستون در مقاله خود شرح داده دوباره سعی بر فعال سازی Gzip کنید.
3- فشرده سازی تصاویر
در بسیاری از وب سایت ها بیشتر پهنای باند را تصاویر اشغال می کنند. WP Smush.it یکی از افزونه های بزرگ است که تصاویری را که شما در رسانه خود آپلود می کنید به طور خودکار فشرده سازی می کند . تمامی فشرده سازی ها ” Lossless ” است ؛ به این معنی که در کیفیت تصاویر هیچ گونه تفاوتی متوجه نخواهید شد.
اگر هزاران تصویر در کتابخانه رسانه خود دارید این افزونه تمامی آنها را می تواند فشرده سازی کند .
4- وسیله نفوذ در کش مرورگر
کش گرفتن مرورگر یک مساله دشوار است. تعداد محدودی افزونه برای کش و ذخیره دردسترس هستند, که باید دقت داشت در صورتی که افزونه به درستی نصب نشود بیشتر از فایده مشکل ساز خواهد شد.
همچنین کش مرورگر برای کاربرانی سرعت را بالا می برد که قبلا نیز بازدید کننده وب سایت شما بوده باشند , و یک نسخه از برگه وب سایت شما را در حافظه مرورگر ذخیره کرده باشند.
برای این کار من افزونه WP Super Cache را معرفی می کنم. البته دقت داشته باشید پس از نصب و راه اندازی حتما از درستی راه اندازی افزونه اطمینان حاصل کنید. همچنین می توانید برای منقضی شدن هدر کد زیر را به فایل .htaccess اضافه کنید.
کد:
#
# associate .js with “text/javascript” type (if not present in mime.conf)
#
AddType text/javascript.js
#
# configure mod_expires
#
# URL: http://httpd.apache.org/docs/2.2/mod/mod_expires.html
#
ExpiresActive On
ExpiresDefault“access plus1seconds”
ExpiresByType image/x-icon“access plus2692000seconds”
ExpiresByType image/jpeg“access plus2692000seconds”
ExpiresByType image/png“access plus2692000seconds”
ExpiresByType image/gif“access plus2692000seconds”
ExpiresByType application/x-shockwave-flash“access plus2692000seconds”
ExpiresByType text/css“access plus2692000seconds”
ExpiresByType text/javascript“access plus2692000seconds”
ExpiresByType application/x-javascript“access plus2692000seconds”
ExpiresByType text/html“access plus600seconds”
ExpiresByType application/xhtml+xml“access plus600seconds”
#
# configure mod_headers
#
# URL: http://httpd.apache.org/docs/2.2/mod/mod_headers.html
#
Header set Cache-Control“max-age=2692000,public”
Header set Cache-Control“max-age=600,private,must-revalidate”
Header unset ETag
Header unset Last-Modifiedیکی از ویژگی های وردپرس آن است که همه چیز را به صورت خودکار ذخیره می کند , اما مشکل اینست که در پایگاه داده شما هزاران بازیابی نوشته ها , بازتاب , پینک بک , نظرات تایید نشده و موارد موجود در سطل زباله وجود دارد که از سرعت می کاهد.
راه حل این مشکل افزونه فوق العاده WP-Optimize است , که بطور معمول پایگاه داده سطل زباله را پاک می کند , و تنها بانک اطلاعاتی کارآمد و اطلاعات مورد نیاز را نگه می دارد. البته زمان انجام عملیات پاک سازی از داده های جدید بک آپ یا پشتیبانی تهیه می کند.
6- کوچک کردن فایل های CSS و JAVASCRIPT
اگر شما تعداد زیادی افزونه نصب کرده اید , در لینک هر صفحه شما حدودا بین 10 – 20 برگه استایل فردی و فایل های جاوا اسکریپت وجود دارد. این اصلا ایده آل نیست. قرار دادن تمامی جاوا اسکریپت ها در یک فایل جاوا اسکریپت و تمامی CSS ها در یک فایل CSS به طور قابل توجهی کارآمد تر است.
افزونه Better WordPress Minify یکی از بهترین افزونه های وردپرس است که فایل های جاوا اسکریپت و برگه های استایل فردی را مرتب می کند و تعداد در خواست هایی که مرورگر نیاز به ساخت آنها را دارد کاهش می دهد.
7- غیر فعال کردن PINGBACKS و TRACKBACKS
PINGBACKS و TRACKBACKS روش های ورد پرس برای هشدار دادن است مانند هشدار پست خود را لینک کنید. با اینکه کار جالبی انجام می دهند اما در سرعت وب سایت شما تاثیر دارد و بهتر است غیر فعال شوند. شما می توانید آنها را از تنظیمات وردپرس غیر فعال کنید.
8- مشخص کردن ابعاد تصاویر و مجموعه کاراکتر ها
قبل از اینکه مرورگر بازدید کننده بتواند وب سایت شما را نمایش دهد , مرورگر باید محتوای اطراف تصاویر را پخش کند. بدون دانستن اندازه ی تصاویر شما , مرورگر باید اندازه ها را کشف کند پس موجب می گردد این کار طولانی تر گردد.
تعیین اندازه تصاویر موجب صرفه جویی در مرورگر برای گذشتن از این مرحله می شود.
به همین دلیل , مشخص کردن مجموعه کاراکتر در هدر های HTTP مفید است , چون مرورگر نیازی ندارد زمان اضافی صرف انجام این کار کند.
9- حرکت CSS به بالا و جاوا اسکریپت به پایین
لینک کردن صفحات استایل , در نزدیکی بالای برگه بسیار توصیه می شود چون مرورگر ها برگه را قبل از بارگزاری فایل CSSبارگزاری نخواهند کرد. از طرف دیگر جاوا اسکریپت باید در پایین نزدیک به فوتر باشند چون از تجزیه هرچیز در مرورگر تا زمان لود کامل جلو گیری می کند.
در اکثر موارد, این تعمیر ساده سرعت بارگزاری وب سایت را تا حد زیادی بهینه می کند. اما این مورد می تواند در وب سایت هایی که تکیه شدیدی به جاوا اسکریپت دارند سبب بارگزاری و مشاهده صفحه وب سایت قبل بارگزاری فایل های جاوا اسکریپت شود.
10- استفاده از CSS SPRITES
SPRITES در اصل یک فایل تصویر بزرگ است که شامل همه ی تصاویر تکی در کنار یکدیگر است. با استفاده از CSS شما می توانید هر چیزی را مخفی کنید به جز تصاویر برای اینکار شما نیاز دارید مجموعه ای از مختصات را مشخص کنید.
CSS SPRITES به وب سایت شما سرعت می دهد چون لود یک تصویر بزرگ سریعتر از لود تصاویر کوچک است.
بالا بردن سرعت لود وب سایت با استفاده از CSS SPRITES
SpriteMe ساده ترین راه حل است , ابزاری است که همه ی تصاویر شما را به CSS SPRITES تبدیل می کند.
به یاد داشته باشید که Safari نمی تواند sprites های بزرگ را لود کند , بنابراین با استفاده از William Malone’s calculator، شما می توانید sprites بزرگ را تشخیص دهید.
11- فعال کردن Keep Alive – زنده نگه داشتن
زنده نگه داشتن (Keep Alive (HTTP به این موضوع اشاره دارد که بین دستگاه مشتری و سرور وب , برای اجازه دسترسی به دانلود یک فایل درخواست ارسال می شود. فعال کردن Keep Alive اجازه می دهد تا دستگاه شما بدون نیاز به کسب اجازه بارها و بارها فایل های متعددی را دانلود کند , در نتیجه در پهنای باند صرفه جویی می شود.
برای فعال کردن Keep Alive ، براحتی کد زیر را در فایل .htaccess کپی و paste کنید.
کد:
Header set Connection keep-aliveامروزه استفاده از گوشی های همراه برای رفتن به وب بیشتر از دکستاپ می باشد , در نتیجه کاربران بیشتر از اینترنت تلفن همراه استفاده می کنند که سرعت پایین تری برای بارگزاری دارد. در نتیجه شما نیاز دارید سرعت لود وب سایت بالایی داشته باشید تا بازدید کنندگان خود را از دست ندهید.