لست بحاجة إلى Next.js

تُعد Next.js الإجابة الافتراضية لبناء تطبيقات React. إنه إطار عمل رائع، لكن كون الشيء افتراضيًا لا يعني أنه ضروري.

استخدامها في المشروع الخاطئ كلفنا السرعة وتسبب في احتكاك داخل الفريق. لقد قمنا ببناء منتج كثيف البيانات يحتوي على لوحات تحكم (dashboards) ورسوم بيانية، وكانت كل شاشة تقريبًا تتطلب تسجيل دخول.

بالنسبة لهذا النوع من التطبيقات، أضاف الـ server-side rendering (SSR) تكلفة دون إضافة قيمة حقيقية.

الأداة المناسبة تعتمد على ما تقوم ببنائه.

المشاريع التي تعتمد على المحتوى أولاً: • مواقع التسويق • المدونات • واجهات المتاجر • التوثيق (Docs) • استخدم Next.js هنا. حيث تهم محركات البحث (SEO) ويكون المحتوى ثابتًا (static).

المشاريع التي تعتمد على التطبيق أولاً: • الأدوات الداخلية • لوحات التحكم (Dashboards) • لوحات الإدارة • واجهات SaaS • استخدم Vite-based SPA هنا. فهذه التطبيقات تعمل خلف نظام مصادقة (auth) وتعتمد على الـ APIs.

لقد انتقلنا من Next.js إلى Vite SPA. وإليك الأسباب:

  1. سهولة تصحيح الأخطاء (Debugging) أخطاء الخادم لا ترتبط بوضوح بمكوناتك (components). أما أخطاء جانب العميل (client-side) فتحدث في المتصفح مع تتبع واضح لمسار الخطأ (stack traces)، مما يجعل إصلاح الأخطاء سريعًا.

  2. اختبار أفضل لا يمكنك بسهولة إجراء اختبار وحدة (unit test) لمكون خادم يقوم برسم مكونات خادم أخرى. لقد اتخذنا قرارات تصميمية فقط لضمان إمكانية الاختبار، وكان ذلك خطأً.

  3. مصادقة (Auth) أبسط يتطلب الـ SSR من الخادم التحقق من الرموز (tokens) مع كل طلب، مما يزيد من مساحات الهجوم (attack surfaces) ويعقد منطق ملفات تعريف الارتباط (cookies). أما التطبيق الذي يركز على العميل فيتعامل مع المصادقة في مكان واحد: الـ API.

  4. تكاليف بنية تحتية أقل يحتاج الـ SSR إلى خادم يعمل دائمًا لكل طلب. بينما يتم إرسال الواجهة الأمامية الثابتة (static frontend) كملفات من خلال CDN. وهذا يعني خدمة أقل تحتاج إلى تشغيل وتأمين.

  5. تعقيد أقل تفرض Next.js فصلاً بين الخادم والعميل. وكان على مهندسي الواجهة الأمامية إدارة أمور تتعلق بالخادم مثل الـ middleware والـ caching، مما أبطأ من وتيرة عملنا.

لقد قمنا بالهجرة على مراحل. احتفظنا بـ Next.js للصفحات العامة التي تهم محركات البحث (SEO). ونقلنا كل شيء آخر إلى Vite SPA.

كانت المقايضات بسيطة: • SEO: لوحات التحكم التي تتطلب تسجيل دخول لا تحتاج إلى SEO. • التحميل الأولي: التطبيقات كثيفة البيانات عادة ما تكون بطيئة بسبب قاعدة البيانات، وليس بسبب إطار العمل.

استخدم Next.js إذا كانت الـ SEO ومعاينات التواصل الاجتماعي (social previews) تهمك. استخدم Vite SPA إذا كان تطبيقك تفاعليًا، ويعتمد على البيانات، ويعمل خلف نظام تسجيل دخول.

توقف عن استخدام الخيار الافتراضي. اسأل نفسك عما تبنيه حقًا.

المصدر: https://dev.to/moruno21/you-dont-need-nextjs-heres-why-708