موقع YanKaven : http://dancewithnet.com/
معرف الموارد المنتظم (URI) للبيانات
URI للبيانات هو مخطط محدد بواسطة RFC 2397 لتضمين الملفات الصغيرة مباشرة في المستندات. من خلال بناء الجملة التالي، يمكنك تحويل ملف صغير إلى ترميز محدد وتضمينه مباشرة في الصفحة:
البيانات: [<نوع MIME>] [؛base64]، <data>
- نوع MIME: يحدد MIME للبيانات المضمنة. شكله هو [type]/[subtype]؛ على سبيل المثال، MIME المطابق لصورة png هو image/png. يمكن استخدام المعلمة لتحديد معلومات إضافية، وفي كثير من الحالات، تكون معلمة مجموعة الأحرف المستخدمة لتحديد طرق ترميز النص مثل النص/العادي والنص/htm. الافتراضي هو text/plain;charset=US-ASCII.
- base64: ترميز البيانات الذي يلي العبارة هو base64 ، وإلا يجب أن تكون البيانات مشفرة بنسبة مئوية (أي urlencode للمحتوى).
قدم HTML 4.01 مخطط URI للبيانات في القرن الماضي، حيث تدعمه جميع المتصفحات السائدة باستثناء IE6 وIE7 ، ومع ذلك، لا يزال لدى IE8 قيود في دعم URI للبيانات ، فهو يدعم الكائنات فقط. img ونوع الإدخال = الصورة والرابط وعنوان URL في CSS، ولا يمكن أن يكون حجم البيانات أكبر من 32 كيلو بايت.
ميزة:
- قم بتقليل عدد طلبات HTTP ، ولا يوجد حد لاستهلاك اتصال TCP وتزامن المتصفح تحت نفس اسم المجال.
- سيتم تقليل عرض النطاق الترددي للملفات الصغيرة. على الرغم من أن كمية البيانات ستزداد بعد الترميز، إلا أنه سيتم تقليل رأس http. عندما تكون كمية البيانات في رأس http أكبر من زيادة ترميز الملف، سيتم تقليل عرض النطاق الترددي.
- بالنسبة لمواقع HTTPS، ستكون هناك مطالبات أمان عند الخلط بين HTTPS وHTTP، ويكون HTTPS أكثر تكلفة من HTTP، لذا فإن URI للبيانات يتمتع بمزايا أكثر وضوحًا في هذا الصدد.
- يمكن حفظ صفحة الوسائط المتعددة بأكملها كملف.
القصور :
- ولا يمكن إعادة استخدامه إذا تم تطبيق نفس المحتوى على نفس المستند عدة مرات، فيجب تكراره عدة مرات، مما يزيد بشكل كبير من كمية البيانات ويزيد من وقت التنزيل.
- لا يمكن تخزينه مؤقتًا بمفرده، لذلك يجب إعادة تحميله عند إعادة تحميل المستند الذي يحتوي عليه.
- يحتاج العميل إلى إعادة فك التشفير وعرضه مما يزيد من استهلاك النقاط.
- ضغط البيانات غير مدعوم، وسيؤدي ترميز Base64 إلى زيادة الحجم بمقدار 1/3، وسيزيد حجم البيانات بشكل أكبر بعد ترميز urlencoding.
- لا يؤدي ذلك إلى تصفية برامج الأمان، وهناك أيضًا بعض المخاطر الأمنية.
أتش تي أم أل
MHTML هو اختصار لـ MIME HTML (ملحق HTML لبريد الإنترنت متعدد الأغراض) وهو حل محدد بواسطة RFC 2557 لحفظ كافة محتويات صفحة الوسائط المتعددة في نفس المستند. تم اقتراح هذا الحل من قبل Microsoft لدعمه بدءًا من IE5.0، وبدأ Opera9.0 أيضًا في دعمه. يمكن لـ Safari حفظ الملف بتنسيق .mht (لاحقة ملف MHTML)، ولكنه لا يدعم عرضه.
يشبه MHTML نسبيًا معرف URI للبيانات، مع وظائف أكثر قوة وصياغة أكثر تعقيدًا، وليس به عيب "لا يمكن إعادة استخدامه" في معرف URI للبيانات، ومع ذلك، فإن MHTML ليس مرنًا وسهل الاستخدام، على سبيل المثال، عنوان URL لـ يمكن أن يكون مرجع المورد الموجود في ملف mht عنوانًا نسبيًا، وإلا فيجب أن يكون عنوانًا مطلقًا. يستخدم حل Hedger لـ IE في "Cross Browser Base64 Encoded Images Embedded in HTML" مسارًا نسبيًا لأنه تم الإعلان عن نوع المحتوى: message/rfc822 بحيث يقوم IE بتوزيعه وفقًا لـ MHTML لاستخدام بروتوكول MHTML، يجب استخدام المسارات المطلقة في هذا الوقت، مثل "MHTML - عندما تحتاج إلى بيانات: معرفات URI في IE7 وما دونه" .
طلب
يمكن أن يؤدي الجمع بين Data URI وMHTML إلى حل مشكلة جميع المتصفحات الرئيسية بشكل كامل، نظرًا لأنه لا يمكن تخزينها مؤقتًا وإعادة استخدامها، فهي غير مناسبة للاستخدام مباشرة في الصفحة، ولكن يمكن استخدامها بشكل مناسب للصور في ملفات CSS وJavaScript. هناك مزايا كبيرة في استخدام:
- تم تقليل عدد الطلبات بشكل كبير الآن. يشير CSS لمواقع الويب الكبيرة إلى عدد كبير من موارد الصور.
- يمكن تخزين كل من CSS وJavaScript مؤقتًا، مما يؤدي إلى تنفيذ التخزين المؤقت للبيانات بشكل غير مباشر.
- يمكن أن يؤدي استخدام CSS إلى حل مشكلة إعادة استخدام URI للبيانات
- قل وداعًا لـ CSS Sprites . إن ظهور CSS Sprites يهدف إلى تقليل عدد الطلبات. ومع ذلك، بالإضافة إلى جلب الاستثناءات في ظل ظروف غير مؤكدة ، تتطلب CSS Sprites أيضًا دمج الصور بشكل اصطناعي، حتى لو كانت هناك أداة دمج، فلا يزال من الضروري وجودها تستغرق الألغاز الكثير من الوقت وتجعل صيانتها صعبة. عند اتباع مبادئ تصميم معينة، يمكنك التخلي تمامًا عن CSS Sprites لكتابة CSS، وأخيرًا استخدام أدوات لتحويل الصور إلى Data URI وMHTML عند التحميل إلى الخادم، مثل "استخدام data-uri لدمج أوراق الأنماط والصور" باستخدام الأدوات المطبقة في بايثون، يمكن أن توفر الكثير من الوقت.
- يؤدي ترميز Base64 إلى زيادة ملف الصورة بمقدار 1/3. إن استخدام URI للبيانات وMHTML في نفس الوقت يعادل زيادة قدرها 2/3، ومع ذلك، يمكن لـ CSS وJavaScript استخدام ضغط gzip، والذي يمكن أن يوفر 2/3 من حجم البيانات لذلك باستخدام ضغط gzip تكون كمية البيانات النهائية هي (1 + 1/3) * 2 * (1/3) = 8/9، وبالتالي يتم تقليل حركة المرور النهائية.
من أجل تسهيل تنفيذ Data URI وMHTML في CSS، قمت بكتابة مولد URI وMHTML للبيانات . يمكنك الاطلاع على مثال التطبيق لاستخدامه لإنشاء Data URI وMHTML .
عند استخدام MHTML في ملف CSS، يجب أن يستخدم عنوان URL مسارًا مطلقًا، وهو غير مرن للغاية، لذا يمكنك التفكير في استخدام تعبير CSS لحل المشكلة ( DEMO )، مثل:
/*
http://old9.blogsome.com/2008/10/26/css-expression-reloaded/
http://dancewithnet.com/2009/07/27/get-right-url-from-html/
*/
* صورة الخلفية: التعبير (وظيفة (ele) {
ele.style.backgroundImage = 'url(mhtml:' +
document.getElementById('data-uri-css').getAttribute('href',4) +
'!03114501408821761.gif)';
}(هذا))؛
النص الأصلي: http://dancewithnet.com/2009/08/15/data-uri-mhtml/
