التحسينات
يأتي Next.js مع مجموعة متنوعة من تحسينات الأداء المدمجة المصممة لتحسين سرعة تطبيقك ومقاييس الويب الأساسية (Core Web Vitals). سيغطي هذا الدليل التحسينات التي يمكنك الاستفادة منها لتحسين تجربة المستخدم.
المكونات المدمجة
توفر المكونات المدمجة تجريدًا لتعقيد تنفيذ تحسينات واجهة المستخدم الشائعة. هذه المكونات هي:
- الصور: مبنية على عنصر
<img>الأصلي. يقوم مكون الصورة بتحسين الصور للأداء عن طريق التحميل المتأخر وتغيير حجم الصور تلقائيًا بناءً على حجم الجهاز. - الرابط: مبنية على علامات
<a>الأصلية. يقوم مكون الرابط بجلب الصفحات مسبقًا في الخلفية، لتحقيق انتقالات أسرع وأكثر سلاسة بين الصفحات. - النصوص البرمجية: مبنية على علامات
<script>الأصلية. يمنحك مكون النص البرمجي تحكمًا في تحميل وتنفيذ النصوص البرمجية لجهات خارجية.
البيانات الوصفية
تساعد البيانات الوصفية محركات البحث على فهم محتوىك بشكل أفضل (مما قد يؤدي إلى تحسين تحسين محركات البحث)، وتتيح لك تخصيص طريقة عرض المحتوى الخاص بك على وسائل التواصل الاجتماعي، مما يساعدك على إنشاء تجربة مستخدم أكثر جاذبية واتساقًا عبر منصات مختلفة.
يسمح لك مكون Head في Next.js بتعديل <head> للصفحة. تعلم المزيد في وثائق مكون Head.
الأصول الثابتة
يمكن استخدام مجلد /public في Next.js لخدمة الأصول الثابتة مثل الصور والخطوط والملفات الأخرى. يمكن أيضًا تخزين الملفات داخل /public مؤقتًا بواسطة موفري CDN حتى يتم تسليمها بكفاءة.
التحليلات والمراقبة
بالنسبة للتطبيقات الكبيرة، يتكامل Next.js مع أدوات التحليلات والمراقبة الشائعة لمساعدتك في فهم أداء تطبيقك. تعلم المزيد في أدلة التحليلات, OpenTelemetry, وأدوات القياس (Instrumentation).