لا يوجد حالة عملاء لإدارتها ولا تأثير للكتابة. المكون الذي يسترجع قائمةك يحل صورها أيضًا، ويتلقى المتصفح ترميزًا مكتملاً مع الرابط في مكانه.
أربع خطوات، واحدة منها ملف تكوين تعديله مرة واحدة وتنساه.
npm i vehicleimagery، وضع المفتاح في متغير بيئة، وإضافة مضيف الصور إلى remotePatterns في next.config.
المكون نفسه الذي يحمل القائمة يحل مركبته ويتلقى روابط لكل زاوية.
أرسل الرابط مع العرض والارتفاع الصريحين. يدير المحسن srcset، وتدير الأبعاد الثابتة تحرك التكوين.
تغير صور المركبات عندما يتغير Catalogue، لا لكل طلب. نافذة إعادة التحقق التي تُقاس بالساعات عادةً تكون كريمة.
أدخل صور المركبات إلى منتجك بلا عناء. توثيق واضح وحزم تطوير مفتوحة وإضافات جاهزة تتصل بمنظومتك خلال دقائق، وصفحة الحالة تُظهر لك مباشرةً كيف تعمل الواجهة.
يخزن CDN الصورة، ويحتوي مخزن ISR الخاص بك على نتيجة الدقة. معًا، يعني ذلك يمكن لصفحة تفاصيل المركبة المزدحمة تقديم آلاف الزيارات دون إجراء أي مكالمة تترك خادمك.
الأخطاء الشائعة هي معالجة صور المركبات على أنها مشكلة عملاء في إطار يوفر لك خادمًا مجانًا. يمكن أن يعمل useEffect في مكون البطاقة أثناء التطوير ثم يظهر في الإنتاج كبيانات اعتماد مكشوفة، ووقت أكبر لملء المحتوى الرئيسي أبطأ، وشبكة تتدفق بينما تتسرب البيانات.
الحل أثناء العرض يزيل الثلاثة في نفس الوقت. يحدث استعلام القائمة واستعلام الصورة في نفس المكان، يتم تخزين النتيجة بواسطة نفس قواعد إعادة التحقق كما هو الحال مع باقي الصفحة، ويرى next/image رابطًا بعيدًا عاديًا. تنتهي التكامل إلى بضعة أسطر في ملف كنت ستكتبه على أي حال.
نعم. أضف مضيف الصور لدينا إلى remotePatterns في next.config، فيعالج المحسنهم مثل أي صورة بعيدة أخرى.
كلاهما. موجه التطبيق هو الأنسب لأن الحل ينتمي إلى مكون خادم، ولكن مكالمة getServerSideProps أو getStaticProps تعمل بشكل مماثل.
ISR، في معظم الحالات. صور المركبات تتغير مع فهرسك بدلاً من كل زائر، لذا يكون نافذة إعادة التحقق لمدة عدة ساعات عادةً أكثر من كافية.
نعم. يستخدم SDK fetch ولا يحتوي على أي تبعيات خاصة بـ Node، لذا تعمل معالجة المسارات الطرفية ووسائط التوسط دون الحاجة إلى شيم.
لا. يمكنك طلب العرض الدقيق الذي تقوم بتشغيله وتخطى next/image تمامًا. المحسن مريح لـ srcset، وليس شرطًا.
يخبرك الرد عندما يتم استخدام نموذج عام مبدئي، لذا يمكنك اختيار بين إظهاره، أو إظهار بديل مميز، أو إخفاء مكان الصورة.
أخبرنا عن المسارات التي تعرض المركبات وأبعاد العرض التي يتم عرضها بها. نعود إليك بالروابط ودخول remotePatterns الذي تحتاج إليه.
