CyberV
موقع شركة استشارات تقنيّة إقليميّة. خلفيّة Laravel، واجهة Tailwind، نموذج محتوى ثنائيّ اللغة، حجم الصفحة انخفض إلى نصف ما كان على WordPress السابق.
عن المشروع.
CyberV شركة استشارات تقنيّة إقليميّة احتاجت موقعًا مؤسّسيًّا تستطيع تحديثه بنفسها دون استدعاء مطوّر لكلّ تعديل سطر. بنيت لها خلفيّة Laravel بنموذج محتوى ثنائيّ اللغة، وواجهة Tailwind، وتجربة تحرير تتيح للموظّفين غير التقنيّين النشر بالعربيّة والإنجليزيّة من النموذج نفسه. كان موقع WordPress السابق ثقيلًا وبطيئًا على شبكات الجوّال الخليجيّة؛ الموقع الجديد يحمّل في أقلّ من ثانية على 4G.
ما الذي تغيّر.
من البدء إلى الإطلاق
زيادة في الـ leads المؤهَّلة
ما الذي وجدناه.
شركة استشارات تقنيّة إقليميّة احتاجت موقعًا مؤسّسيًّا يمكنها تحديثه دون استدعاء مطوّر لكلّ تعديل سطر — ثنائيّ ar/en، سريع على شبكات الموبايل الخليجيّة، متوافق مع هويّتهم المتطوّرة.
ما الذي فعلناه.
باك-إند Laravel مع نموذج محتوى ثنائيّ، فرونت Tailwind، تجربة محرّر يستطيع غير التقنيّين نشر ar/en من نفس النموذج. استبدل بناء WordPress بطيء كان يكافح على 4G.
ما الذي أصبح.
وزن الصفحة انخفض إلى النصف. تحميل دون ثانية على 4G. تدفّق تحرير ثنائيّ يستخدمه الفريق دون دعم هندسيّ.
دوري الفعليّ في هذا المشروع.
منفرد · 100٪ — تصميم، باك-إند Laravel، فرونت Tailwind، نموذج محتوى ثنائيّ، نشر. زوّد فريق CyberV الاتّجاه والمحتوى؛ كلّ شيء تقنيّ (ومعظم التنفيذ البصريّ) لي.
مصمّم + منفّذ هويّة
ترجمت هويّة CyberV إلى الويب. تمريرة طباعة ثنائيّة (عربيّ + لاتينيّ). تهيئة Tailwind + رموز تصميم.
مهندس باك-إند (Laravel)
نموذج Eloquent ثنائيّ (حقول قابلة للترجمة عبر Spatie/translatable)، مدير Filament للتحرير غير التقنيّ، خطّ نموذج الاتّصال.
مهندس فرونت-إند
Tailwind + Alpine.js. مضبوط يدويًّا لأداء 4G. وسائط lazy-loaded، lighthouse 90+.
DevOps
VPS Cloudways، نسخ احتياطيّة يوميّة من Forge، نطاق مخصّص، تجديد TLS تلقائيّ.
الأرقام التي تهمّ.
- 50٪تقليص وزن الصفحةمقابل بناء WordPress السابق — تأكّد عبر لوحة شبكة Chrome DevTools قبل/بعد.
- <1sتحميل 4G · p75محاكاة شبكة 4G سعوديّة؛ تحقّق على جهاز خليجيّ حقيقيّ.
- 90+نتيجة Lighthouse perfعلى صفحتي الرئيسيّة + الخدمات. قوالب أخرى 85+.
- ثنائيّاستمارة واحدة ar/enالمحرّرون يكتبون اللغتين في استمارة Filament واحدة — لا منشورات منفصلة.
- 0تبعيّات pluginsلا فوضى WordPress plugins. كلّ الميزات كود Laravel أصليّ.
ما الذي كان معطّلاً فعلاً.
تجاوزت CyberV ما يستطيع موقعها على WordPress تمثيله بصدق. كان الموقع بطيئًا على نفس الشبكة التي يستخدمها عملاؤهم المستهدفون (موبايل خليجيّ)، التجربة الثنائيّة تطلّبت منشورين منفصلين لكلّ صفحة (دون ضمان بقائهما متزامنين)، وكلّ تغيير مفيد يتطلّب مطوّرًا لأنّ منشئ الصفحات لم يدعم أنماط علامتهم. المطلوب: موقع يحرّرونه بأنفسهم، يحمل فورًا على هاتف 4G في الرياض، يُقرأ جدّيًّا بالعربيّة والإنجليزيّة.
المساحة الصعبة من المشروع.
- 01نموذج محتوى ثنائيّ يفرض تكافؤ ar/en دون مضاعفة سطح التحرير.
- 02ميزانيّة أداء تنجو من شبكات الموبايل السعوديّة (زمن استجابة متغيّر، احتياط 3G أحيانًا).
- 03تجربة محرّر يستطيع مدير حساب — لا مطوّر — استخدامها بارتياح.
- 04نظام بصريّ متوافق مع العلامة لكن مرن، ينجو من 2-3 تحديثات علامة سنويًّا دون لمس هندسيّ.
انتصارات هندسيّة تستحقّ التسمية.
تحرير ثنائيّ باستمارة واحدة
مورد Filament بحقول ar/en مزدوجة جنبًا إلى جنب. التحقّق يتطلّب اللغتين قبل الحفظ. الحالة الفارغة تعرض شارات «ترجمة مفقودة» في فهرس المدير، لا فقط على الموقع الحيّ.
انضباط وزن الصفحة
خطوط مستضافة ذاتيًّا (مجموعة فرعيّة + WOFF2 فقط)، لا إطار JS، صور lazy-loaded مع `loading="lazy"` + `decoding="async"`، purge Tailwind يقطع CSS إلى <12KB مضغوط.
كيف يتشابك النظام.
طبقة الحافّة
طبقة التطبيق
طبقة البيانات
القرارات وراء كلّ اختيار.
Laravel + Filament
- مدير Filament أسرع طريقة لبناء تجربة محرّر غير تقنيّ في PHP. جاهز: جداول، نماذج، تحقّق، رفع ملفّات — كلّ الأجزاء المملّة.
- Laravel + Spatie/translatable يعطي محتوى ثنائيّ دون منشورين لكلّ صفحة.
- نفس المنظومة التي يمكن لمزوّد الزبون التالي (إن وُجد) التقاطها — لا تبعيّات غريبة.
Tailwind + Alpine عوضًا عن React
- موقع مؤسّسيّ معظمه نصّ + صور. React كان سيشحن +50KB runtime دون فائدة وظيفيّة.
- Alpine يتعامل مع البتات التفاعليّة الصغيرة (تنقّل موبايل، modal) في 8KB.
ما علّمنا إيّاه هذا البناء.
- وزن الصفحة ليس مقياس غرور في الخليج. تغطية 4G ممتازة لكنّها غير متّسقة — كلّ KB موفّر يظهر في نسبة الارتداد.
- تجربة المحرّر تحدّد تواتر التحديث. لو كان المدير مزعجًا، يصير الموقع قديمًا خلال سنة.