عادةً ما يتم تقسيم عرض الصفحة إلى تقديم الواجهة الأمامية وتقديم النهاية الخلفية. يشير التقديم الأمامي إلى أن الخادم يعيد إطار عمل HTML والقالب ، ويقوم الواجهة الأمامية بسحب البيانات ويجعل القالب من خلال طلب Ajax غير المتزامن ، ويقوم بتعديل DOM ديناميكيًا لتشكيل الصفحة النهائية. يتم عرض جانب الخادم عندما يقوم الخادم بسحب البيانات على الواجهة الخلفية ويجعل الصفحة الكاملة ويعود إلى العميل. الطريقتان لها فوائدهما الخاصة. يجلب التقديم الخلفي فوائد مثل زيادة الوقت على الشاشة الأولى ، مما يقلل من عدد الطلبات ، والاستفادة من كبار المسئولين الاقتصاديين. ومع ذلك ، يتطلب التقديم المباشر للواجهة الخلفية التقليدية الانتظار حتى يتم تقديم صفحة الويب بأكملها قبل العودة إلى العميل. إذا قامت كتلة بسحب البيانات ببطء ، مما يؤثر على سرعة التقديم ، ثم بالنسبة للمستخدمين ، فسيصبح أيضًا أطول أثناء الانتظار. يمكن أن يكون عرض النهاية الخلفية هو نفسه عرض Ajax في الواجهة الأمامية ، وتقديم التقدم التقليدي في الجهة والمناطق في الكتل والمناطق ، وسيتم توفير حل أدناه-عرض قطاع صفحة الويب.
أولاً ، دعونا نلقي نظرة على طريقة التقديم التقليدية:
const http = require ("http") ؛ const fs = require ("fs") ؛ var tpl1 = '<! doctype html> <html> <head> <title> اختبار الاختبار </title> </body> helloword <p> $ data1 </p> ؛ var tpl2 =' p> </ p> </pod html = '' ؛ var server = http.createserver ((req ، res) => {if (req.url! == "/favicon.ico") {res.writehead (200 ، {'content-type': 'text/html'}) ؛ RES.END (TPL1.REPLACE (// $ data1/g ، data1) }}) ؛ }}). الاستماع (3000 ، '127.0.0.1') ؛ وظيفة getDataOne (fn) {setTimeOut (() => { FN ('11111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 FN ('222222222222222222222222222222222222222222222222222222 2222222222222222222222222222222222222222222222222222222222 2222222222222222222222222222222222222222222222222222222222 2222222222222222222222222222222222222222222222222222222222 2222222222222222222222222222222222222222222222222222222222 2222222222222222222222222222222222222222222222222222222222 2222222222222222222222222222222222222222222222222222222222 2222222222222222222222222222222222222222222222222222222222نوفر أعلاه مثالًا بسيطًا لإرجاع صفحة من خلال زيارة http://127.0.0.1:3000. عند تقديم الصفحة ، هناك عمليتان يستغرقان 5 ثوانٍ ، والتي يمكن افتراض أن IO أو سحب البيانات. في هذا الوقت ، يكون الوقت الذي نلاحظ فيه صفحة الإرجاع 10 ثوانٍ ، مما يعني أن الأمر يستغرق 10 ثوانٍ للمستخدم لرؤية الصفحة.
بعد ذلك ، نقوم بتحويل طريقة تقديم الخلفية ونغيرها إلى التقديم المجزأة.
const http = require ("http") ؛ const fs = requist ( }) ؛ Res.end ('<p> $ data2 </p> </body> </html>'. }) ؛ }) ؛ }) ؛ }) ؛ }) ؛ }) ؛ }). الاستماع (3000 ، '127.0.0.1') ؛ وظيفة getDataOne (fn1) {setTimeOut (() => { FN1 ('1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 1111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111 FN2 ('22222222222222222222222222222222222222222222222222222 2222222222222222222222222222222222222222222222222222222222 2222222222222222222222222222222222222222222222222222222222 2222222222222222222222222222222222222222222222222222222222 2222222222222222222222222222222222222222222222222222222222 2222222222222222222222222222222222222222222222222222222222 2222222222222222222222222222222222222222222222222222222222 2222222222222222222222222222222222222222222222222222222222من خلال تعيين رأس HTTP: ترميز النقل: مكثف ، يتم تمكين سحر الإرسال المجزأ. توجد طريقة الترميز هذه في http1.1. بشكل عام ، لا يمكن تحديد حجم المعلومات عندما يقوم الخادم بإنشاء استجابات HTTP. في هذا الوقت ، لا يمكن كتابة الطول مقدمًا بطول المحتوى ، ويجب إنشاء طول الرسالة في الوقت الفعلي. يستخدم الخادم عمومًا الترميز المكثف.
عند إجراء ناقل حركة ترميز مكثف ، هناك ترميز نقل على رأس رسالة الرد ويتم تعريفه على أنه مكثف ، مما يشير إلى أن المحتوى سيتم إرساله باستخدام الترميز المكثف. دعونا نلقي نظرة على التأثير المعدل:
على الرغم من أن وقت نقل الصفحة العام لم يتغير ، وبهذه الطريقة ، قللنا من وقت الاستجابة بمقدار النصف ، مما يقلل من وقت انتظار المستخدم. في الأعمال التجارية المحددة ، يمكننا القول أن الأجزاء التي يحتاج المستخدمون إلى رؤيتها أولاً هي الإخراج مقدمًا ، وعملية الواجهة الخلفية الأجزاء طويلة الأجل من الخلفية إلى الإخراج ، وهي ميزة عرض الإرسال المجزأة. لاحظ أنه إذا كان الخادم nginx ، فمن الممكن أن يكون التقديم المجزأة غير صالح بسبب إعدادات المخزن المؤقت ، ويجب ضبط حجم المخزن المؤقت.