روش ترکیب جاوا اسکریپت خارجی در وردپرس

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

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

چرا باید فایل های جاوا اسکریپت خارجی را با هم ترکیب کنید؟

همانطور که ممکن است بدانید، زمانی که شما یک HTML درخواست می کنید page، مرورگر برای تمام منابع مورد نیاز استعلام ارسال می کند. همه فایل‌ها، از جمله فایل‌های جاوا اسکریپت، از سرور واکشی شده و دوباره در مرورگر بارگذاری می‌شوند.

در هر درخواست، فایل های جاوا اسکریپت با هم دانلود می شوند اما به ترتیب ظاهرشان در HTML اجرا می شوند. در حالی که خود دانلود جداگانه ممکن است وب سایت را کند کند، فرآیندهای توالی ممکن است شما را بیشتر منتظر نگه دارد.

فایل‌های جاوا اسکریپت، همراه با فایل‌های CSS، منابع مسدودکننده رندر هستند – اجزای دیگر را بارگیری نمی‌کنند مگر اینکه همه فایل‌ها به طور کامل بارگیری شوند. همانطور که این فایل ها معمولا در سر یک وب قرار دارند page، ممکن است مشکلاتی ایجاد کند.

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

وب سایت های زیادی مانند Pingdom، GTMetrix و Google PageSpeed ​​Insights که به شما در انجام آن کمک می کند. تنها کاری که باید انجام دهید، لینک وب سایت خود را قرار دهید و روی آنالیز کلیک کنید.

در اینجا نمونه هایی از نتایج سایت آزمایشی ما آمده است:

در حالت ایده آل، نتیجه باید در دسته های سبز (سریع) باشد. یا حداقل، مطمئن شوید که سایت شما در دسته قرمز قرار ندارد. اگر این اتفاق افتاد، فورا اقدام کنید.

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

HTTP/2

پیاده سازی آخرین فناوری مانند HTTP/2 همیشه سودمند است. اگر ارائه دهنده هاست شما از آن پشتیبانی می کند – به عنوان هاستینگer انجام می دهد – ممکن است نیازی به ترکیب فایل ها نباشد زیرا از دانلودهای موازی پشتیبانی می کند.

HTTP/2 – پروتکل انتقال ابرمتن نسخه 2 – در سال 2015 منتشر شد – به عنوان یک نسخه پیشرفته از HTTP/1.1 که استاندارد ارتباطات آنلاین از سال 1989 بوده است. بهبود پروتکل جدید در نظر گرفته شده است:

• بهتر کردن page سرعت بارگذاری
• دانلودهای موازی را فعال کنید
• مالتی پلکس را فعال کنید
• فشرده سازی هدر درخواست ها
• انسداد سر خط یا بسته

این نسخه جدید چندین روش برای کاهش تأخیر دارد که بر عملکرد کلی وب سایت تأثیر می گذارد.

به خاطر داشته باشید که این آموزش ترکیب فایل های جاوا اسکریپت خارجی برای کسانی است که از HTTP/1.1 استفاده می کنند.

چگونه فایل های جاوا اسکریپت خارجی را در وردپرس ترکیب کنیم؟

همانطور که قبلاً ذکر شد، چندین فایل جاوا اسکریپت به کل زمان رندر اضافه می‌شود و هنگام اجرا یک هشدار ایجاد می‌کند page تست سرعت بار

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

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

بنابراین، می توانید از یک افزونه برای ترکیب جاوا اسکریپت خارجی در وردپرس استفاده کنید تا زندگی خود را آسان تر کنید.

یکی از بهترین افزونه ها برای انجام این کار این است بهینه سازی خودکار.

این افزونه می تواند به شما در انجام وظایف کوچک سازی برای فایل های HTML، CSS یا جاوا اسکریپت کمک کند. این افزونه که به طور مرتب به روز می شود، با بیش از 900000 نصب فعال، به شدت توصیه می شود.

در حالی که می توانید به صورت رایگان از آن استفاده کنید، می توانید نسخه های پریمیوم آن را برای ویژگی های بیشتر دریافت کنید: بهینه سازی خودکار پیکربندی Pro (167 دلار) و بهینه سازی کامل سرعت (671.74 دلار).

پس از نصب و فعال سازی، می توانید به داشبورد وردپرس -> تنظیمات -> بهینه سازی خودکار. زیر JS، CSS و HTML منو، شما می توانید فعال کنید کد جاوا اسکریپت را بهینه کنید. پس از آن، کلیک کنید ذخیره تغییرات.بهینه سازی خودکار است، بنابراین می توانید بلافاصله وب خود را آزمایش کنید page سرعت بارگذاری مجدد برای مشاهده پیشرفت ها.

علاوه بر آن، اگر می خواهید فایل های CSS را ترکیب کنید، می توانید آن را نیز فعال کنید کد CSS را بهینه کنید گزینه. اگر از CDN استفاده می کنید، می توانید تمام گزینه ها از جمله گزینه های CDN را فعال کنید.

نتیجه گیری

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

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

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