روش های افزایش سرعت لود سایت (بخش اول)

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

روش های افزایش سرعت لود سایت

1. درخواست های HTTP را به حداقل برسانید

طبق گفته یاهو، 80٪ از زمان بارگیری یک صفحه وب در بارگیری قسمت های مختلف صفحه مانند تصاویر، صفحه های سبک و اسکریپت ها صرف می شود. برای هر یک از این عناصر درخواست HTTP انجام می شود، بنابراین هرچه تعداد اجزای درون صفحه بیشتر باشد، مدت زمان بیشتری برای ارائه صفحه نیاز است.

اولین قدم برای به حداقل رساندن درخواست های شما این است که بفهمید سایت شما در حال حاضر چه تعداد در خواست HTTP تولید می کند و به عنوان یک معیار استفاده می کنید.

اگر از Google Chrome استفاده می کنید، می توانید با استفاده از ابزارهای توسعه دهنده مرورگر تعداد درخواستهای HTTP سایت خود را ببینید. بر روی صفحه ای که می خواهید تجزیه و تحلیل کنید، کلیک راست کنید و روی «Inspect» کلیک کنید، سپس روی برگه «Network» کلیک کنید.

• اگر برگه “Network” را نمی بینید، ممکن است لازم باشد نوار کناری Developer Tools را با کشیدن به سمت چپ باز کنید

ستون “Name” تمام پرونده های صفحه را نشان می دهد، ستون “Size” اندازه هر پرونده و ستون “Time” مدت زمان بارگیری هر پرونده را نمایش می دهد.

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

2. پرونده ها را کم و ترکیب کنید

اکنون که می دانید سایت شما چند درخواست می کند، می توانید در زمینه کاهش این تعداد کار کنید. بهترین مکان برای شروع کار با فایل های HTML ، CSS و JavaScript است. این ها فایل های بسیار مهمی هستند، زیرا ظاهر سایت شما را تعیین می کنند. آنها همچنین به تعداد درخواست های سایت شما، در هر بار بازدید کاربر از آن افزوده می شوند.

با “minifying” و ترکیب پرونده های خود می توانید این تعداد را کاهش دهید. این باعث کاهش اندازه هر فایل و در نتیجه تعداد کل پرونده ها می شود. کوچک کردن یک فایل شامل حذف قالب بندی، فضای خالی و کد غیر ضروری است.

و اماترکیب پرونده ها به این صورت است که اگر سایت شما چندین فایل CSS و JavaScript را اجرا می کند، می توانید آنها را در یک فایل ترکیب کنید.

روش های مختلفی برای کوچک کردن و ترکیب فایل ها وجود دارد، و اگر سایت شما از طریق وردپرس اجرا می شود، افزونه هایی مانند WP Rocket روند کار را بسیار ساده می کنند.

در صوتیکه این افزونه را نصب کرده اید، به برگه “Static Files” بروید و پرونده هایی را که می خواهید کوچک و ترکیب کنید بررسی کنید. این پرونده ها می توانند شامل پرونده های HTML ، CSS و JavaScript و همچنین Google Fonts باشند.

سپس برو روی گزینه “Save Changes” کلیک کنید. اکنون می توانید صفحه خود را بارگیری کرده و دوباره به ابزارهای برنامه نویس نگاه کنید تا تأثیری را که تغییرات شما ایجاد کرده مشاهده کنید.

3. از بارگذاری همزمان برای پرونده های CSS و JavaScript استفاده کنید

هنگامی که برخی از پرونده های خود را کوچک و ترکیب کردید، می توانید نحوه بارگیری آنها در صفحات خود را نیز بهینه کنید. اسکریپت هایی مانند CSS و JavaScript به دو روش مختلف بارگیری می شوند: همزمان یا غیر همزمان.

اگر اسکریپت های شما به طور همزمان بارگیری می شوند، آنها به ترتیب در صفحه بارگیری می شوند. از طرف دیگر، اگر اسکریپت های شما به روش غیر هم زمان بارگیری شوند، باز هم برخی از آنها به طور همزمان بارگیری خواهند شد.

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

با استفاده از همان برگه “Static Files” از افزونه WP Rocket ، گزینه های کنار “Render-blocking CSS / JS” را علامت بزنید و آنرا ذخیره نمایید.

4. بارگذاری JavaScript را به تعویق بیندازید

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

اگر یک سایت وردپرسی دارید، می توانید با افزونه WP Rocket که در بالا ذکر شد گزینه تعویق بارگیری JavaScript را فعال کنید. به سادگی کادر کنار “Load JS files deferred” را علامت بزنید و سیو کنید.

اگر سایت HTML دارید، باید قبل از برچسب </body> یک فایل JavaScript خارجی فراخوان کنید، چیزی شبیه به این:

5. زمان برای بایت اول را به حداقل برسانید

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

زمان اولین بایت یا TTFB، مدت زمانی است که مرورگر باید قبل از گرفتن اولین بایت داده از سرور منتظر بماند. گوگل TTFB کمتر از 200 میلی ثانیه را توصیه می کند. هنگامی که یک کاربر از سایت شما بازدید می کند، مرورگر وی درخواست HTTP را به سرور میزبان آن می فرستد. سه مرحله وجود دارد که باید بین آن درخواست اولیه و بایت اول داده انجام شود:

1_ جستجوی DNS

2_ پردازش سرور

3_ واکنش

با استفاده از ابزار Developer Chrome یا یک ابزار شخص ثالث می توانید مدت زمان این روند را برای سایت خود ببینید. اگر از Developer Tools استفاده می کنید، لازم است به یاد داشته باشید که زمان پاسخ می تواند تحت تأثیر اتصال به اینترنت شما باشد. بنابراین هرچه اتصال خودتان کندتر باشد، پاسخ سرور شما نیز کندتر ظاهر می شود.

برای دسترسی به این اطلاعات در Developer Tools، به برگه “Network” و بر روی اولین گزینه در ستون “Waterfall” کلیک کنید.

• همچنین می توانید از ابزارهای شخص ثالث رایگان مانند WebPageTest سایت خود را آزمایش کنید.

اگر TTFB شما زیر 200 میلی ثانیه باشد، این کار اثر بخش بوده است. در غیر این صورت، ریشه این مشکل می تواند چند چیز مختلف باشد. به طور کلی، بیشتر مشکلات TTFB کند به دلیل مشکلات شبکه، ایجاد محتوای پویا، پیکربندی وب سرور و ترافیک به وجود می آیند.

در بخش های بعدی این مقاله به توضیح و آموزش سایر موارد برای افزایش سرعت لود سایت می پردازیم (:

منبع