المشروع - كل ما يتعلق بتطوير المواقع http://www.almashroo.com/

لعل أحد أهم النصائح لتحسين سرعة تحميل صفحات الويب هي التقليل من معدل طلبات HTTP للخادم، في الواقع، هذه النصيحة هي أول نصائح ياهوو لأفضل الممارسات لتسريع المواقع. كلما قلت الطلبات على خادم الموقع، كلما ساعد في تحسين سرعة الموقع.

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

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

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

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

سأقوم في هذا المقال بشرح طريقة تطبيق رﻱكابتشا باستخدام 3 طرق مختلفة. أولاً باستخدام PHP، وبعدها بتطبيق شكل مخصص ليتلائم أكثر مع شكل الموقع المراد إدراج الخدمة فيه، وأخيراً باستخدام تقنية أجاكس AJAX.

تعبير التحميل الكسول أو Lazy Loading في العادة يستعمل في لغات البرمجة، ويطلق عند تأخير تحميل كائن أو عنصر ما لحين حاجته. أي معناه، أننا لا نحمل أي كائنات أو عناصر حتى ولو كان يستخدمها البرنامج في وقت لاحق، إلى حين حاجتنا أو استدعائنا لها في ذلك الوقت، وعندها يتم تسخير كل الموارد المطلوبة للتحميل والاستدعاء.

التحميل الكسول يستخدم في عدة لغات، ولكن في هذا المقال، سنرى كيف يمكننا استخدامه في لغة جافاسكربت على عدد من المكتبات المشهورة YUI ،jQuery ،MooTools، وكيف يمكنه أن يفيدنا.

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

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

قبل البدء بكيفية البرمجة، أنصحكم باستخدام برنامج Notepad++ من أجل التخلص من مشاكل التراميز كما أنه يُسّهل عملية البرمجة من خلال تلوين الشفرات.

‎ربما رأيتم هذا التأثير مستخدم في مواقع شركة قوقل Google خصوصاً في خدمة الترجمة Google Translate، وموقع يوتيوب YouTube. عند تحويل اللغة في مدخلات النماذج Forms Input إلى اللغة العربية والبدء في كتابة الأحرف، يتم وبشكل تلقائي تحويل اتجاه النص إلى اليمين ليتماشى مع اللغة. وعند تحويل لغة النص إلى الإنجليزية، يتم تغيير الاتجاه إلى اليسار.

‎في هذا الدرس، سأقوم بشرح طريقة محاكاة نفس هذا التأثير في النماذج. طبعاً، وكما هي عادتنا في المشروع، الشفرة البرمجية في هذا المقال مطروحة بشكل مجاني وحر (مفتوحة المصدر) للاستخدام الشخصي أو التجاري بترخيص غنو GNU GPL v2.

في هذا المقال، سنتعلم بعض ما أحب أن أطلق عليه “الوصفات”، أو الشفرات البرمجية في ملف functions.php ستغنيك عن ما يشبهها من إضافات لنظام WordPress.

ملف functions.php هو ملف للدوال التي تستخدم باستمرار من قبل ملفات القالب الخاص بمدونة WordPress. هذا الملف يمكن أن يعمل عمل الإضافات، وإذا كان موجوداً لديك في مجلد القالب، فإن WordPress سيقوم بتحمليه آلياً عند التهيئة (في صفحات لوحة التحكم والصفحات الخارجية). أي أنه سيكون حاضراً لديك في كل الأوقات للإستدعاء منه.

إذا لم يكن لديك هذا الملف في مجلد القالب، ببساطة، قم بإنشاء ملف عادي، وسمّه functions.php داخل المجلد، وأبدأ معنا بتجربة بعض هذه الوصفات.