رفع سرعت صفحه گوگل حذف رندر-مسدود کردن جاوا اسکریپت و CSS در محتوای بیش از حد
- رفع انسداد Javascript و CSS را انجام دهید
- JavaScript و CSS مسدودکننده رندر را در محتوای بالاتر از حد حذف کنید: نحوه اصلاح آن را نشان دهید
- بارگیری پرونده های Javascript
- CSS را بعد از بار HTML بارگیری کنید
- تست سرعت سایت Google را پشت سر بگذارید!
- چگونگی حذف منابع رندر-مسدود کردن در وردپرس
- یک سیستم خارجی داشته باشید که وب سایت خود را برای شما بهینه کند
- سوالات متداول
- نمره فانوس کروم کامل: چه اتفاقی می افتد؟ - video
- نظرات (8)
رفع انسداد Javascript و CSS را انجام دهید
تست Google PageSpeed [1] حذف رندر مسدود کردن جاوا اسکریپت و CSS در محتوای سطحی بالاتر پیشنهاد می کند که فایل های JS و CSS سایت شما بعد از اینکه HTML به طور کامل بارگذاری شد ارائه شود - بنابراین، بارگذاری HTML خود را متوقف نکنید آنها را دانلود کنید.
[1] - PageSpeed Insights - developers.google.comتعریف اسکریپت مسدود کننده رندر: اسکریپت هایی که قبل از تجزیه کامل HTML DOM بارگیری می شوند. به عنوان مثال ، اسکریپت های موجود در سرصفحه یا درون محتوا ، بدون هیچ دستورالعمل خاصی برای مرورگرها ، برای به تأخیر انداختن بارگذاری اسکریپت تا بعد از رنگ آمیزی HTML.
JavaScript و CSS مسدودکننده رندر را در محتوای بالاتر از حد حذف کنید: نحوه اصلاح آن را نشان دهید
- از یک سیستم خارجی بخواهید وب سایت خود را برای شما بهینه کند
- از CDN استفاده کنید که تمام بهینه سازی های احتمالی را از طرف شما انجام دهد ، از جمله سه بهینه سازی زیر که برای رفع از بین بردن منابع انسداد رندر لازم است:
- به تعویق انداختن پرونده های جاوا اسکریپت
- CSS را پس از بارگذاری HTML بارگیری کنید
- از یک افزونه وردپرس استفاده کنید
بهینه سازی های زیادی برای رفع منابع جلوگیری از رندر لازم وجود دارد و ممکن است اجرای آنها توسط خودتان خسته کننده باشد - بعلاوه ، شما باید به طور مداوم به دنبال آزمایش های جدید موجود در Chrome LightHouse و Google PageSpeed در میان سایر تست های سرعت صفحه باشید.
هیچ راه حلی برای حذف منابع انسداد رندر در کد htaccess وجود ندارد زیرا این مسئله مربوط به DOM است ، به معنی محتوای وب سایت و ترتیب بارگیری منابع شامل ، مانند Javascript و CSS ، اما نه تنها. این موارد را نمی توان در Htaccess فعال کرد ، بلکه فقط در محتوای HTML DOM وجود دارد.
اگر این مشکلات را برای دسک تاپ حل کنید ، همزمان منابع مسدود کننده رندر را برای موبایل از بین خواهید برد زیرا هر دو دقیقاً یکسان هستند!
Did you know that you can even have all these steps executed automatically for you by using an external شتاب دهنده سرعت سایت technology, which through artificial intelligence will preload your site, optimize it, and deliver it to your visitors? It is possible with tools such as Ezoic platform offering, with a free trial and no credit card required. Otherwise, implement below optimizations in your website!
بارگیری پرونده های Javascript
برای بارگذاری فایل های JS شما [2] شما می توانید async یا اضافه کردن دستورالعمل به لینک های اسکریپت خود را اضافه کنید. Async تضمین نمی کند که آنها به همان ترتیب بارگذاری شوند - بنابراین اگر شما چندین اسکریپت داشته باشید که باید یکی پس از دیگری اجرا شود، ترجیح دادن بازخوانی ترجیح داده می شود تا ترتیب را تضمین کنید:
[2] - حذف JavaScript مسدود کننده رندر | بینش PageSpeed | برنامه نویسان خوب - developers.google.comCSS را بعد از بار HTML بارگیری کنید
برای اینکه CSS پس از انتقال کامل HTML کامل بارگذاری شود، گوگل [3] این قطعه کد را برای اضافه کردن در انتهای HTML خود، به عنوان مثال پس از بستن تگ پایینی و قبل از بستن تگ، پیشنهاد می کند:
[3] - تحویل CSS را بهینه کنید | بینش PageSpeed | برنامه نویسان خوب - developers.google.comبه منظور بهینه سازی وب سایت شما، ایده خوبی است که کد CSS استفاده نشده را حذف کنید، عملیات که می تواند خسته کننده باشد، اگر شما در طراحی وب استفاده نکنید. اگر شما خودتان تم وب سایت خود را ایجاد نکرده اید، ممکن است از یک سیستم خارجی استفاده کنید تا کد CSS استفاده نشده را بر روی صفحات خود از طرف خود حذف کنید، مانند جهش EZOIC به عنوان مثال، نسخه جدید (و کاملا رایگان) سایت شگفت انگیز خود را سرعت شتاب دهنده
تست سرعت سایت Google را پشت سر بگذارید!
این اجازه داد که من آزمون Google PageSpeed [1] را منتقل کنم. از بین بردن رندرینگ-مسدود کردن جاوا اسکریپت و CSS در محتوای بالاتر (همراه با دست کشیدن مرورگر Leverage [4]) در یک وب سایت، از 51 نمره در تلفن همراه ( شکل 1) 72 (شکل 2)، و از 59 (شکل 3) تا 79 روی دسکتاپ (شکل 4).
[4] - برطرف کردن cache مرورگر اهرم Google PageSpeed در htaccess - یوان Bierling ، SAP بین المللی / مشاور وب - www.ybierling.comچگونگی حذف منابع رندر-مسدود کردن در وردپرس
برای از بین بردن منابع مسدود کردن رندر در وردپرس، لازم است یک افزونه مانند JetPack نصب شود.
سپس به گزینه هایی بروید که برای آن شما باید یک مدیر باشید و به گزینه های JetPack> Writing> Performance and Speed بروید. چک کنید Enable accelerator site، سرعت بار بارگذاری تصویر را افزایش دهید، سرعت بار بارگذاری فایل را افزایش دهید، و بارگذاری تنبل را برای تصاویر.
استاد ایجاد وب سایت: اکنون ثبت نام کنید!
حضور دیجیتالی خود را با دوره جامع ایجاد وب سایت ما تغییر دهید - سفر خود را برای تبدیل شدن به یک متخصص وب امروز شروع کنید!
ثبت نام در اینجااین باعث می شود که منابع رندر سازی شده در WordPress و صفحات بارگذاری سریعتر با اجازه دادن به JetPack برای بهینه سازی تصاویر شما و ارائه تصاویر و فایل های استاتیک (مانند CSS و جاوا اسکریپت) از شبکه جهانی سرورها، از بین بروند.
نحوه حذف رندر-مسدود کردن جاوا اسکریپت و CSS در وردپرسهمچنین، فراموش نکنید که با استفاده از یک تابع بار بار بارگذاری تصاویر بارگیری را بارگیری کنید. در حالی که آن را به سختی مورد استفاده قرار گرفت و نیاز به یک کتابخانه خارجی برای به دست آوردن تصاویر بارگیری تصاویر خارج از صفحه، در حال حاضر ممکن است بومی در HTML5 ممکن است!
برای پیاده سازی بارگیری تنبل تصاویر بر روی وب سایت های خود، به سادگی مقادیر تنبل را به ویژگی های بارگذاری تصاویر وب سایت خود اضافه کنید و مرورگرهای اخیر متوجه خواهند شد که این تصاویر فقط باید درخواست و بارگذاری شوند اگر نمایش داده شوند، به این معنی که کاربر به پایین حرکت می کند متغیرهایی تصویر
<img src=”SRC” alt=”ALT” loading=”lazy”></img>
LAZY LOADING - عملکرد وب - شبکه توسعه دهنده موزیلادر بالای آن، بارگذاری تنبل نیز با Iframes کار می کند و یک پیاده سازی مهم برای از بین بردن منابع مسدود کردن رندر از صفحات وب شما است.
هنگامی که منابع مسدود کننده رندر دستورالعمل هایی برای بارگذاری پس از محتوای اصلی، به این معنی که HTML DOM، شما در حال حاضر بسیاری از امتیازات در آزمون فانوس Google، آزمون صفحه نمایش سرعت، یا Google Core Web Vitals کسب خواهید کرد.
یک سیستم خارجی داشته باشید که وب سایت خود را برای شما بهینه کند
آیا می دانید بدون هیچ تلاش زیادی از سایت خود - به جز ثبت نام در یک آزمایش رایگان و تغییر DNS خود ، می توانید تمام مشکلات Google PageSpeed را از طرف شما حل کنید؟
با استفاده از پلت فرم Ezoic Site Speed Accelerator ، کلیه مسائل معمول صفحه PageSpeed توسط سیستم آنها حل می شود ، که واسطه بین وب سایت شما و بازدید کنندگان خواهد بود. آنها قبل از نمایش آن به بازدید کننده خود ، صفحه وب را برای شما بهینه می کنند.
با ثبت نام آزمایشی رایگان در پلت فرم Ezoic سبز شوید و آن را برای خودتان امتحان کنید - آنها باعث می شوند وب سایت شما طی چند روز به بالاترین استانداردهای بهینه سازی سرعت صفحه برسد: ارائه تصاویر وب نسل بعدی ، ارائه CSS و JavaScript با حذف CSS بلا استفاده و JS ، تصاویر با بار تنبلی ، تغییر اندازه تصاویر ، حافظه پنهان صفحات سایت ، بهینه سازی قلم ها ، پیش اتصال به تمام سایت های درج شده خود و موارد دیگر.
کارت اعتباری لازم نیست - تنها کاری که باید انجام دهید این است که بصورت رایگان ثبت نام کنید و امتحان کنید. به علاوه ، اگر وب سایت شما از تبلیغات نمایشگر درآمد کسب می کند ، علاوه بر اینکه وب سایت شما خیلی سریع تر می شود ، آنها همچنین می توانند با بهینه سازی تبلیغات خود با یادگیری ماشین و هوشمند سازی مصنوعی پیشرفته ، چندین برابر بیشتر از آنچه در Google AdSense انجام می دهید ، کسب کنند.
سوالات متداول
- چگونه می توان جاوا اسکریپت و CS را در محتوای بالاتر از آن از بین برد؟
- برای از بین بردن JavaScript و CSS مسدود کننده رندر برای محتوای بالاتر ، باید اطمینان حاصل کنید که پرونده های JS و CSS سایت شما پس از بارگیری کامل HTML بارگیری می شوند. این به معنای مکث فرآیند بارگیری HTML برای بارگیری این پرونده ها نیست. می توانید پرونده های JavaScript را با ویژگی Async یا Defer به تعویق بیندازید و برای CSS می توانید از کد خاص برای بارگیری آن پس از HTML استفاده کنید. یک سیستم بهینه سازی خارجی مانند Ezoic همچنین می تواند به طور خودکار این کار را انجام دهد.
- چگونه توسعه دهندگان وب می توانند به توصیه Google Pagespeed برای از بین بردن JavaScript و CSS مسدود کننده رندر بپردازند؟
- توسعه دهندگان وب می توانند سایت خود را با کوچک کردن فایل های JavaScript و CSS ، با استفاده از بارگذاری ناهمزمان برای JavaScript ، ورود CSS بحرانی به طور مستقیم در HTML ، بهینه سازی کنند و بارگذاری CSS غیر بحرانی و پرونده های JavaScript را انجام دهند. اجرای این استراتژی ها می تواند به طور قابل توجهی زمان بارگذاری و نمرات Pagespeed را بهبود بخشد.
نمره فانوس کروم کامل: چه اتفاقی می افتد؟
Yoann Bierling یک متخصص انتشارات وب و مشاوره دیجیتال است و از طریق تخصص و نوآوری در فناوری ها تأثیر جهانی می کند. او در مورد توانمندسازی افراد و سازمانها برای شکوفایی در عصر دیجیتال ، وی را به ارائه نتایج استثنایی و رشد رشد از طریق ایجاد محتوای آموزشی سوق می دهد.
استاد ایجاد وب سایت: اکنون ثبت نام کنید!
حضور دیجیتالی خود را با دوره جامع ایجاد وب سایت ما تغییر دهید - سفر خود را برای تبدیل شدن به یک متخصص وب امروز شروع کنید!
ثبت نام در اینجا