كيفية تقليل HTML و CSS و JavaScript باستخدام Autoptimize Plugin

04.06.2020
سئو محلی 'كيفية تقليل HTML و CSS و JavaScript باستخدام Autoptimize Plugin
0 19 мин.

تقدم Google ومحركات البحث الأخرى قيمة لموقعك على الويب إذا تم تحميله بهذه السرعة. لأنه ليس لدى أي من المشاهدين الكثير من المرضى للانتظار طويلًا لعرض المحتوى الخاص بك ولديك 1.5 ثانية فقط لجذب انتباههم. إذا استغرق فتح موقعك وقتًا طويلاً ، فإنك عادةً ما تفقد المشاهدين. لذلك ، هذا ضروري لتسريع موقع الويب الخاص بك. هناك عدة طرق يمكنك من خلالها تحسين موقعك. ولكن أحد أهم الأجزاء هو تصغير HTML و CSS و JavaScript.


إذا كنت قد أجريت اختبار سرعة في أي وقت سرعة الصفحة أو GTmetrix, ربما ترى هذا الخيار.

يتم تحميل كل موقع ويب يحتوي على الكثير من الملفات التي تحتوي على HTML و CSS و JavaScript. وتتضمن معظم الملفات مساحة كبيرة ، وتعليقات ، ومحددات الحظر وما إلى ذلك. لذلك ، يستغرق تحميلها بشكل صحيح وقتًا إضافيًا.

هذا يعتمد أيضًا على جودة السمة. على سبيل المثال ، جودة السمة المميزة أفضل دائمًا من السمة المجانية. السمات المميزة مشفرة ومصممة بشكل جيد من قبل المطورين ذوي المهارات العالية. لكن جميع الموضوعات ليست هي نفسها ولها نوع مختلف من الوظائف. لذا ، بواسطة التقليل ملف HTML و CSS و JavaScript ، يمكنك زيادة سرعة موقعك بشكل استراتيجي وجعل زوارك سعداء.

ما هو Minify ولماذا هو مفيد?

التصغير هي لغة برمجة تزيل جميع الأحرف غير الضرورية من شفرة المصدر دون تغيير وظيفتها. تحتوي هذه الأحرف غير الضرورية عادة على “أحرف المسافة البيضاء, أحرف سطر جديد, تعليقات, و محددات الكتلة “. 

قبل التصغير وبعد التصغير

يتم استخدامها لإضافة قابلية القراءة إلى التعليمات البرمجية ولكن ليست مطلوبة لتنفيذها. وبهذه الطريقة تقلل من مقدار الرمز الذي يجب نقله عبر الويب ويحفظ النطاق الترددي الخاص بك. هكذا تصغير HTML و CSS و JavaScript, يمكنك بسهولة إزالة تلك الأحرف غير الضرورية من موقعك وبشكل ملحوظ زيادة سرعة موقعك. 

كيفية تصغير HTML و CSS و JavaScript

هناك طريقتان يمكنك من خلالهما تصغير HTML و CSS & جافا سكريبت. إما يمكنك القيام بذلك عن طريق تعديل رمز السمة الخاص بك أو يمكنك استخدام مكون WordPress الإضافي المسمى تحسين تلقائي. في هذه المقالة ، سنعرض لك كلتا العمليتين حول كيفية تصغير HTML و CSS و JavaScript.

لمعرفة ملف HTML أو CSS أو JavaScript بالضبط الذي يسبب المشكلة ، تحتاج إلى التحقق من ذلك في أي أداة لاختبار سرعة الموقع مثل أداة Google PageSpeed أو GTmetrix. لأنه لا تحتوي جميع ملفاتك على هذا النوع من الأحرف غير الضرورية.

بعد التحقق من نتيجة موقعك ، ستحصل عليها. هنا صورة أدناه من موقعي الذي يفكر تحديد CSS و جافا سكريبت.

تصغير Css وجافا سكريبت

إنها تميل إلى جودة السمة الخاصة بك. لذلك ، لا داعي للقلق إذا رأيت أن كلاهما يقال لـ Minify ومن الأفضل الحصول على سمة Premium.

هناك بعض الأدوات عبر الإنترنت التي يمكنك من خلالها تصغير HTML و CSS و JavaScript code. 

قبل إجراء أي تغيير ، خذ نسخة احتياطية من هذا الملف.

رقم 1 تصغير الرمز:

تصغير أداة الكود

تصغير الرمز أداة الكل في واحد التصغير. يمكنه تقليل رموز JavaScript و CSS و HTML الخاصة بك. كل ما تحتاجه لنسخ كود HTML أو CSS أو JavaScript ولصقه هنا. ثم انقر فوق قلل اختيار. تقوم هذه الأداة تلقائيًا بتصغير التعليمات البرمجية الخاصة بك. بعد ذلك ، انسخ الرمز Minified في هذا الملف.

يمكنك أيضًا تصغير رمز CSS و JavaScript مثل شفرة HTML باستخدام هذه الأداة.

# 2 Willpeavy:

Willpeavy

Willpeavy هو أداة رائعة أخرى ل تصغير HTML الرموز. تعمل هذه الأداة بنفس الطريقة التي يعمل بها تصغير التعليمات البرمجية. يقلل من HTML وأي CSS أو JS مضمنة في الترميز الخاص بك. لاستخدام هذه الأداة ، ما عليك سوى نسخ الرمز الخاص بك هنا والنقر فوق Minify.

تصغير استخدام Autoptimize Plugin

تحسين تلقائي

إذا لم تكن على دراية بمثل هذا الترميز ، فمن الأفضل استخدام مكون إضافي وموصى به للمبتدئين. حتى هنا يأتي تحسين البرنامج المساعد تلقائيًا إلى عن على وورد المستخدمين.

يقوم Autoptimize بربط كل البرامج النصية ورموز الأنماط ويجعلها أصغر حجمًا يتم تحميلها بسرعة كبيرة. يقلل من جميع HTML ، CSS & كود جافا سكريبت نفسه ويجعل صفحتك خفيفة الوزن حقًا. باستخدام Minification ، يضيف هذا المكون الإضافي الرؤوس منتهية الصلاحية وينقل الأنماط إلى رأس الصفحة ويمكنه نقل النصوص البرمجية إلى التذييل.

تحسين إعدادات التوصيات تلقائيًا

يمكنك بسهولة القيام بكل الأشياء من إعدادات البرنامج المساعد. بعد تنشيط هذا البرنامج المساعد ، انتقل إلى الإعدادات> تحسين تلقائي.  انقر فوق الزر “إظهار الإعدادات المتقدمة”.

في ال لغة البرمجة القسم ، تحقق من “تحسين كود HTML” و “الاحتفاظ بتعليقات HTML” للحصول على أداء أسرع.

تحسين خيارات HTML تلقائيًا

في ال جافا سكريبت القسم ، قم بتمكين “تحسين كود JavaScript”. يمكنك أيضًا تمكين “فرض JavaScript في” لتحميل JS مبكرًا وتقليل فرصة أخطاء JS. إذا كان JS يكسر النصوص البرمجية ، فيمكنك تمكين “إضافة التفاف الالتقاط”.
تحسين خيارات JavaScript تلقائيًا

في CSS القسم ، قم بتمكين “تحسين كود CSS” ، “قم أيضًا بتجميع CSS المضمنة”. يمكنك أيضًا تمكين “Inline and Defer CSS” إذا قمت بتصغير CSS. جرب هذه الأداة لتصغير CSS الخاص بك ولصقه في المربع.

تحسين خيارات CSS تلقائيًا

ادخل CDN عنوان URL في حقل “عنوان URL الأساسي لـ CDN”. على سبيل المثال ، “//cdn.example.com/”.

وأخيرًا ، قم بتمكين “Save script / css المجمع كملف ثابت”. ولكن تأكد من أن خادم الويب الخاص بك يمكنه التعامل مع الضغط وانتهاء الصلاحية بشكل صحيح.

تحسين خيارات CDN تلقائيًا

بعد تصغير الشفرة ، لا تنس التحقق من سرعة موقعك مرة أخرى. ثم قارنها بالنتائج السابقة. إذا واجه موقعك بعض المشكلة أو لم يظهر بشكل صحيح ، فيمكنك محاولة محو المشكلة مخبأ

استنتاج

تصغير HTML و CSS و شبيبة مفيد لموقعك. فهو يزيل الأحرف غير الضرورية من التعليمات البرمجية ويجعلها أصغر حجمًا ومتوافقة مع المتصفح. بهذه الطريقة يمكنك تحسين سرعة تحميل موقعك.

إذا كان هذا البرنامج التعليمي يساعد على تصغير HTML و CSS و JavaScript ، فيرجى مشاركة هذه المقالة على موقع التواصل الاجتماعي الفيسبوك, تويتر, جوجل+.

مقالات ذات صلة,

  • كيفية الاستفادة من التخزين المؤقت للمتصفح على وورد
  • كيفية تحسين قاعدة بيانات ووردبرس] باستخدام WP-Sweep
  • 7 أفضل محسن صورة لووردبريس 2017
  • كيفية تمكين ضغط Gzip بسهولة في WordPress للتحميل بشكل أسرع
Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Понравилась статья?
    Комментарии (0)
    Комментариев нет, будьте первым кто его оставит

    Комментарии закрыты.

    Adblock
    detector