اگر از همراهان همیشگی پرشین تولز هستید، حتماً مقاله قبلی در مورد رفع خطاهای سایت به کمک GTmetrix را خواندهاید! در این مقاله هم قصد داریم به بررسی ادامه این بحث بپردازیم تا بتوانید با افزایش سرعت سایت، وضعیت سئوی سایت خود را بهبود ببخشید و رضایت کاربران را هم جلب کنید.
چگونه خطای Make AJAX cacheable در GTmetrix را رفع کنیم؟
AJAX یا Asynchronous Javascript and XML در وردپرس، مجموعهای از تکنیک های مورد استفاده در توسعه وب است که به یک صفحه وب اجازه میدهد بدون بارگذاری مجدد صفحه، با یک سرور ارتباط برقرار کند. با استفاده از AJAX ، برنامه های موجود در وب میتوانند بدون دخالت در صفحه وب موجود ، دادهها را با سرور تبادل کنند. اگرچه “X” در نظر گرفته شده برای XML است ، اما نیازی به استفاده از XML برای تبادل داده نیست! در عوض JSON قابل استفاده است. در وردپرس ، AJAX را میتوان در صفحه نمایش ویرایش پست مشاهده کرد که میتوانید در حین نوشتن یک پست، بدون بارگذاری مجدد صفحه، دسته جدیدی اضافه کنید. نمونه دیگر را میتوان در صفحه نظرات مشاهده کرد که می توانید بدون بارگذاری مجدد صفحه، نظر را تأیید یا حذف کنید! در برنامه های کامپیوتری ، اگر آنها مستقل از سایر فرایندها عمل کنند ، “غیر همزمان یا asynchronous ” هستند. به همین دلیل برای ارسال اطلاعات به سرور نیازی به بارگیری مجدد صفحه وب نیست. روش دقیق برای این کار از چیزی به نام یک شی XMLHttpRequest استفاده می کند، که به طور مؤثر واسط است که به اسکریپت ها اجازه می دهد درخواست های AJAX را انجام دهند. AJAX فقط یک فناوری نیست. همه این فناوری ها برای ایجاد یک درخواست HTTP یا HTTPS با هم کار می کنند.
یکی دیگر از خطاهایی که به ندرت در هنگام تست سرعت سایت با GTmetrix باهاش مواجه میشویم با عنوان Make AJAX cacheable در جی تی متریکس نمایش داده میشود که مربوط به لود صفحات به صورت آجاکس در سایت است و تا زمانی که از این قابلیت در سایت استفاده نکرده باشید خطایی از این نظر نخواهید داشت. این خطا مربوط به تست سرعت سایت با الگوریتمهای یاهو است و برای همین در ستون Yslow جی تی متریکس به شما نمایش داده میشود.
همانطور که میدانید با استفاده از قابلیت Ajax میتوانیم بدون این که نیاز باشد صفحات سایت را از ابتدا لود کنیم، محتوای دلخواه را در حالت پس زمینه به کاربران نمایش دهیم؛ یعنی اگر از آجاکس استفاده کنید، برای نشان دادن یک محتوای خاص نیازی به بارگذاری مجدد صفحه نیست و درخواستها به صورت پس زمینه از سمت سرور دریافت میشوند. توی این حالت روند پاسخ دادن از سرور به صورت بهینهتری است و اگر به صورت درست از آجاکس استفاده کنید، صفحات با سرعت خیلی بهتری لود خواهند شد.
غیر از از این موضوع درخواستها هم قابلیت این مسئله که کش شوند را دارند و بخاطر همین موضوع میتوانید سرعت بارگذاری را دو برابر بیشتر کنید. اگر به خطا هم دقت کنید کلمه کش در آن وجود دارد و از شما درخواست میکند که قابلیت آجاکس را به صورت کش شده استفاده کنید. ارور Make AJAX cacheable که مربوط به Yslow جی تی متریکس میشود، خیلی کم رخ میدهد و تقریباً میشود گفت رخ دادن این خطا وجود ندارد. اگر هم این خطا وجود داشته باشد، به معنی توصیه شده است؛ زیرا در بهبود سرعت لود سایت تاثیر بسیار خوبی میتواند داشته باشد. پس اگر هم با این خطا مواجه شوید، کافی است که چنین قابلیتی را در سایت پیاده سازی کنید. برای اینکه درخواستهای آجاکس رو به صورت کش شده لود کنید هم میتوانید از گزینههای زیر استفاده کنید:
- استفاده از Gzip
- پیکربندی ETags
- استفاده نکردن از ریدایرکت
- Reduce DNS lookups
این خطا به گونهای نیست که به صورت عمومی باشد و یک حالت خاصی را داشته باشد، برای برطرف کردنش نیاز به این دارید که کدنویسی کنید و شرایط در دو سایت کاملا مختلف خواهد بود. پس اگه شما هم با خطای Make AJAX cacheable در تست سرعت سایت با جی تی متریکس مواجه شدید، باید از یک کدنویس کمک بگیرید تا با بررسی قابلیت آجاکس در سایت، کدنویسی مربوط به ajax را بررسی و بهبود ببخشد.
رفع خطای Remove duplicate JavaScript and CSS
یکی از دلایلی که باعث افزایش تعداد درخواست HTTP در سایت میشود، فایلهای تکراری هستند! یعنی در سایت یک فایل با محتوای کاملا یکسان قرار دارد و با این تفاوت که از طریق دو آدرس در دسترس است. در این صورت فایل تکراری دو بار شروع به لود شدن در سایت میکند که باعث عدم بهینهسازی سرعت سایت شده و در نتیجه وقتی در حالت تست سرعت سایت هستید، با خطای Remove duplicate JavaScript and CSS مواجه میشوید. وقتی چنین حالتی رخ دهد، کاری که باید انجام دهید، این است که یکی از آدرسهای این فایلها رو از صفحات سایت پاک کنید تا از فایل دومی استفاده شود. یکی از عمدهترین مشکلاتی که پیش میآید، این است که وقتی از وردپرس استفاده میکنید و افزونههایی رو برای انجام کاری نصب میکنید، برخی از این افزونهها از فونت آیکونهایی مثل fontawesome پشتیبانی میکنند که ممکن است در دو یا چند افزونه این فونت وجود داشته باشد! بنابراین هر افزونه تلاش میکند تا فونت آیکون خودش را لود کند که با دو آدرس متفاوت است. بنابراین شما فایل فونت آیکون یکسانی دارید که فقط بخاطر این که هر کدام برای یک افزونه است و در پوشه دیگری از هاست قرار دارد و با دو آدرس متفاوت بارگذاری میشوند! در صورتی که بارگذاری یکی از آنها کافی است. پس کاری که باید انجام دهید، این است که فقط یکی از فایلها را بارگذاری کنید. در بیشتر مواقع اصلاً نیازی به سایر فایلها نیست و میتوانید با بارگذاری یکی از فایلها به درستی سایر بخشهایی که وابسته به این فایلها بوده را نمایش دهید.
یک مورد برای زمانی است که خطای Remove query strings from static resources رخ میدهد. در این حالت شما یک فایل را دارید که بخاطر فعال بودن Query String باعث میشود که به انتهای آدرس یکی از فایلها چیزی مثل ver=1.9.0? اضافه شود که در این حالت هم با خطای duplicate JavaScript and CSS مواجه خواهید شد.
http://ajax.googleapis.com/ajax/libs/scriptaculous/1.9.0/controls.js
هنگامی که این خطا رخ میدهد، دو بار فایلی لود میشود که باعث میشود سرعت بارگذاری سایت پایین بیاید و از طرف دیگر هم بخاطر تعداد درخواست HTTP بیشتر با کندی در سایت مواجه شوید. راهکار رفع این مشکل هم این است که آدرس یکی از فایلها را حذف کنید. اگر این حالت زمانی رخ داد که به صورت query strings بود، کار شما سادهتر بوده و کافی است اقدام به غیرفعال کردن query strings در سایت کنید. اگر از وردپرس استفاده میکنید و مشکل کپی دو فایل بخاطر افزونه رخ داده باشد، میتوانید با ویرایش کردن و حذف آدرس یکی از فایلها، کاری کنید که از آدرس جایگزینش استفاده کند تا مشکل شما برطرف شود. اگر هم از HTML یا سیستم اختصاصی استفاده میکنید باید بگردید و فایلی که حاوی آدرس این دو فایل است را پیدا کنید و آن را حذف کنید تا از آدرس یکسان این فایل خونده شود. انجام این کار به مهارت و سطح آشنایی شما با کدنویسی بستگی دارد، بنابراین اگر آشنایی با این مورد ندارید بهتر است از یک کدنویس کمک بگیرید.