جزوه رنگی و تایپ شده زمان سنجی
دکتر مرعشی کمال‌الدین رحمانی دانشگاه پیام نور علمی کاربردی دانشگاه آزاد حمو خلاصه ضا اسماعیلی پیام نور محم خلاصه ضا
() —
کند. زمانبندی ناوبری 2 [ NAVIGATION-TIMING-2 ] این مشخصات را برای ارائه اطلاعات زمانبندی اضافی مرتبط با ناوبری گسترش می‌دهد.
به عنوان مثال، جاوا اسکریپت زیر یک تلاش ساده برای اندازه جزوه زمان سنجی زمان لازم برای واکشی یک منبع را نشان می دهد:
مثال1
<!doctype html>
<html>
<head>
</head>
<body onload=”loadResources()”>
<script>
function loadResources()
{
var start = new Date().getTime();
var image1 = new Image();
var resourceTiming = function() {
var now = new Date().getTime();
var latency = now – start;
alert(“End to end resource fetch: ” + latency);
};
image1.onload = resourceTiming;
image1.src = ‘https://www.w3.org/Icons/w3c_main.png’;
}
</script>
<img src=”https://www.w3.org/Icons/w3c_home.png”>
</body>
</html>
اگرچه این اسکریپت می تواند زمان لازم برای واکشی یک منبع را اندازه گیری کند، اما نمی تواند زمان صرف شده در مراحل مختلف را تجزیه کند. علاوه بر این، اسکریپت نمی تواند به راحتی زمان لازم برای واکشی منابع توصیف شده در نشانه گذاری را اندازه جزوه زمان سنجی کند.
برای رفع نیاز به اطلاعات کامل در مورد تجربه کاربر، این سند PerformanceResourceTimingرابط کاربری را معرفی می کند. این رابط به مکانیزم‌های جاوا اسکریپت اجازه می‌دهد تا اندازه‌گیری‌های کامل تاخیر سمت کلاینت را در برنامه‌ها ارائه دهند. با استفاده از این رابط، مثال قبلی را می توان برای اندازه گیری زمان بارگذاری درک شده یک منبع تغییر داد.
اسکریپت زیر مدت زمان لازم برای واکشی هر منبع در صفحه را محاسبه می کند، حتی منابعی که در نشانه گذاری تعریف شده اند. این مثال فرض می کند که این صفحه در https://www.w3.org میزبانی می شود. می‌توان مدت زمانی را که در هر مرحله از واکشی منبع با PerformanceResourceTimingاینترفیس لازم است اندازه‌گیری کرد.
مثال2
<!doctype html>
<html>
<head>
</head>
<body onload=”loadResources()”>
<script>
function loadResources()
{
علاوه بر بخش‌هایی که به‌عنوان غیر هنجاری علامت‌گذاری شده‌اند، همه دستورالعمل‌های نگارش، نمودارها، مثال‌ها و یادداشت‌ها در این مشخصات غیرمعمول هستند. هر چیز دیگری در این مشخصات هنجاری است.
کلمات کلیدی MAY ، MUST و SHOULD در این سند باید همانطور که در BCP 14 [ RFC2119 ] [ RFC8174 ] توضیح داده شده است، زمانی که و فقط زمانی که با تمام حروف بزرگ ظاهر می شوند، همانطور که در اینجا نشان داده شده است، تفسیر شوند.
الزاماتی که در دستور به عنوان جزوه زمان سنجی از الگوریتم ها بیان می شوند (مانند “هر کاراکتر فاصله پیشرو را بردارید” یا “نادرست را برگردانید و این مراحل را لغو کنید”) باید با معنای کلمه کلیدی (” MUST “، ” SHOULD “، ” تفسیر شوند. MAY “و غیره) در معرفی الگوریتم استفاده می شود.
برخی از الزامات انطباق به عنوان الزامات مربوط به ویژگی ها، روش ها یا اشیاء بیان می شوند. چنین الزاماتی باید به عنوان الزامات مربوط به عوامل کاربر تعبیر شود.
الزامات انطباق که به عنوان الگوریتم ها یا مراحل خاص بیان می شوند، ممکن است به هر شکلی اجرا شوند، تا زمانی که نتیجه نهایی معادل باشد. (به طور خاص، الگوریتم های تعریف شده در این مشخصات به گونه ای در نظر گرفته شده اند که به راحتی قابل پیگیری باشند، نه اینکه عملکردی داشته باشند.)
زمان سنجی
3. واژه شناسی
ساختار “یک Fooشی”، که Fooدر واقع یک رابط است، گاهی اوقات به جای دقیق تر “یک شیء که رابط را اجرا می کند” استفاده می شود Foo.
در طول این کار، تمام مقادیر زمانی از زمان شروع پیمایش سند [ HR-TIME-2 ] در میلی ثانیه اندازه گیری می شوند. به عنوان مثال، شروع پیمایش سند در زمان 0 رخ می دهد.
توجه داشته باشید
این تعریف از زمان بر اساس مشخصات زمان با وضوح بالا [ HR-TIME-2 ] است و با تعریف زمان استفاده شده در مشخصات زمانبندی ناوبری [ NAVIGATION-TIMING-2 ] متفاوت است، که در آن زمان از نیمه‌شب روز گذشته بر حسب میلی‌ثانیه اندازه‌گیری می‌شود. 1 ژانویه 1970 (UTC).
4. زمان بندی منابع
4.1 مقدمه
این بخش غیر هنجاری است.
رابط اندازه گیری زمان بندی منابع http(های) واکشی شدهPerformanceResourceTiming را تسهیل می کند . به عنوان مثال، این رابط برای اشیاء [ XHR ]، عناصر HTML [ HTML ] مانند ،،،،، و با نوع پیوند ، عناصر SVG [ SVG11 ] مانند svg و . XMLHttpRequestiframeimgscriptobjectembedlinkstylesheetEventSource
4.2 منابع موجود در PerformanceResourceTimingاینترفیس
این بخش غیر هنجاری است.
واکشی درخواست منبع توسط یک کلاینت غیر تهی به عنوان اشیایی در جدول زمانی عملکرد شی جهانی مشتری گنجانده می شود ، مگر اینکه از جدول زمانی به عنوان بخشی از فرآیند واکشی حذف شود . منابعی که از حافظه پنهان HTTP بازیابی می شوند به عنوان اشیاء در جدول جزوه زمان سنجی عملکرد گنجانده می شوند . منابعی که واکشی برای آنها آغاز شد، اما بعداً لغو شد (مثلاً به دلیل یک خطای شبکه) به عنوان اشیاء درPerformanceResourceTimingPerformanceResourceTimingPerformanceResourceTimingجدول زمانی عملکرد ، با زمان شروع و پایان آنها.
مثال ها:
اگر از همان URL متعارف به عنوان src ویژگی دو IMGعنصر HTML استفاده شود، واکشی منبع آغاز شده توسط اولین IMGعنصر HTML به عنوان یک PerformanceResourceTimingشی در جدول زمانی عملکرد گنجانده می شود . عامل کاربر ممکن است URL را برای IMGعنصر دوم HTML دوباره درخواست نکند، در عوض از دانلود موجودی که برای IMGعنصر HTML اول آغاز شده است استفاده کند. در این مورد، واکشی منبع توسط IMGعنصر اول تنها اتفاق در جدول زمانی عملکرد خواهد بود.
اگر ویژگی یک عنصر srcHTML از طریق اسکریپت تغییر کند، هم واکشی منبع اصلی و هم واکشی URL جدید به عنوان اشیاء در جدول زمانی عملکرد گنجانده می شود . IMGPerformanceResourceTiming
IFRAMEاگر یک عنصر HTML از طریق نشانه گذاری بدون تعیین srcویژگی اضافه شود، عامل کاربر ممکن است about:blankسند را برای بارگذاری کند IFRAME. اگر بعداً src ویژگی به صورت پویا از طریق اسکریپت تغییر کند، عامل کاربر ممکن است منبع URL جدید را برای اسکریپت واکشیIFRAME کند . در این مورد، فقط واکشی URL جدید به عنوان یک PerformanceResourceTimingشی در جدول زمانی عملکرد گنجانده می شود .
اگر an XMLHttpRequestدو بار برای یک URL متعارف ایجاد شود، هر دو واکشی منبع به عنوان یک PerformanceResourceTimingشی در جدول زمانی عملکرد گنجانده می شود . این به این دلیل است که واکشی منبع برای دومی XMLHttpRequestنمی‌تواند از بارگیری صادر شده برای اولین استفاده مجدد کند XMLHttpRequest.
اگر یک عنصر HTML IFRAMEدر صفحه گنجانده شود، تنها منبع درخواست شده توسط IFRAME srcویژگی به عنوان یک PerformanceResourceTimingشی در جدول زمانی عملکرد گنجانده می شود . منابع فرعی درخواست شده توسط سند در جدول زمانی عملکرد سند و نه جدول زمانی عملکرد سند اصلی گنجاندهIFRAME می شود . IFRAME
IMGاگر یک عنصر HTML یک data: URIمنبع [ RFC2397 ] داشته باشد، این منبع به عنوان یک PerformanceResourceTimingشی در جدول زمانی عملکرد گنجانده نمی شود . طبق تعریف data: URIشامل داده های جاسازی شده است و نیازی به واکشی ندارد.
اگر واکشی منبع به دلیل یک خطای شبکه (مثلاً خطای DNS، TCP یا TLS) لغو شد، آنگاه واکشی به عنوان یک PerformanceResourceTiming شی در جدول زمانی عملکرد تنها با startTime, fetchStartو تنظیم گنجانده durationمی شود.responseEnd
اگر واکشی منبع به دلیل عدم موفقیت در یک پیش شرط واکشی (مثلاً محتوای مختلط، محدودیت CORS، خط‌مشی CSP و غیره) لغو شود، این منبع به عنوان یک PerformanceResourceTimingشی در جدول زمانی
A یک نوع آغازگرPerformanceResourceTiming DOMString مرتبط دارد.
A یک URL درخواستیPerformanceResourceTiming DOMString مرتبط دارد.
A یک حالت کشPerformanceResourceTiming DOMString مرتبط دارد (رشته خالی، ” “، یا ” “). localvalidated
A یک واکشیPerformanceResourceTiming مرتبط با اطلاعات زمانبندی دارد.
A PerformanceResourceTimingدارای اطلاعات منبع اطلاعات بدن پاسخ مرتبط است .
A PerformanceResourceTimingدارای وضعیت جزوه مدیریت بحران وضعیت مرتبط است .
A PerformanceResourceTimingدارای وضعیت مسدودسازی رندر مرتبط است . RenderBlockingStatusType
PerformanceResourceTimingرابط در جدول زمانی عملکرد شرکت می کند و ویژگی های زیر را گسترش می PerformanceEntry دهد:
نام
مراحل دریافت کننده نام عبارتند از برگرداندن URL درخواستی این .
نوع ورود
مراحل دریافت کننده enterType عبارتند از برگرداندن DOMString ” resource”.
زمان شروع
مراحل دریافت کننده startTime تبدیل مُهر زمانی واکشی برای زمان شروع اطلاعات زمانبندی و شیء جهانی مربوطه است .
توجه داشته باشید
startTimeدرست در ابتدای واکشی ، قبل از هرگونه تغییر مسیر اندازه گیری می شود. واکشی را ببینید .
مدت زمان
مراحل دریافت کننده مدت زمان برگرداندن زمان پایان این اطلاعات زمان منهای زمان شروع این اطلاعات زمان بندی است .
وقتی فراخوانی شد، عملیات پیش‌فرضtoJSON [ WEBIDL ] به JSON را اجرا کنید .
initiatorTypeمراحل دریافت کننده عبارتند از برگرداندن نوع آغازگر برای این .
توجه داشته باشید
initiatorTypeیکی از مقادیر زیر را برمی گرداند:
“navigation”، اگر درخواست یک درخواست ناوبری باشد.
“css”، اگر درخواست نتیجه پردازش یک دستورالعمل CSS url () مانند @import url()یا background: url(); [ CSS-VALUES ]
“script”، اگر درخواست نتیجه بارگیری هر اسکریپت باشد (یک اسکریپت کلاسیک script، یک اسکریپت ماژول یا یک Worker).
“xmlhttprequest”، اگر درخواست نتیجه پردازش یک XMLHttpRequest;
“fetch”، اگر درخواست نتیجه پردازش روش باشد. fetch()
زمان
“beacon”، اگر درخواست نتیجه پردازش روش باشد. [ بیکن ] sendBeacon()
“video”، اگر درخواست نتیجه پردازش videoعنصر posterیا src.
“audio”، اگر درخواست نتیجه پردازش audioعنصر باشد src.
“track”، اگر درخواست نتیجه پردازش trackعنصر باشد src.
“img”، اگر درخواست نتیجه پردازش imgعنصر srcیا srcset.
“image”، اگر درخواست نتیجه پردازش عنصر تصویر باشد. [ SVG2 ]
“input”، اگر درخواست نتیجه پردازش یک inputعنصر از type image.
“a”، اگر درخواست نتیجه پردازش یک aعنصر downloadیا ping.
“iframe”اگر درخواست نتیجه پردازش یک درخواست iframeباشد src.
“frame”، اگر درخواست نتیجه بارگذاری یک frameباشد.
“other”، در صورتی که هیچ یک از شرایط فوق مطابقت نداشته باشد.
توجه داشته باشید
تنظیم initiatorTypeدر مکان‌های مختلفی که یک ورودی زمانبندی منبع گزارش می‌شود، مانند استاندارد واکشی انجام می‌شود .
مراحل دریافت workerStartکننده عبارتند از تبدیل واکشی مُهر زمانی برای زمان شروع سرویس نهایی این اطلاعات زمانبندی و شیء جهانی مربوطه برای این کار . برای اطلاعات بیشتر به واکشی HTTP مراجعه کنید .
مراحل دریافت redirectStartکننده تبدیل مُهر زمانی واکشی برای زمان شروع تغییر مسیر اطلاعات زمانبندی و شیء جهانی مربوطه برای آن است . برای اطلاعات بیشتر به واکشی HTTP-redirect مراجعه کنید .
مراحل دریافت redirectEndکننده تبدیل مُهر زمانی واکشی برای زمان پایان تغییر مسیر اطلاعات زمانبندی و شیء جهانی مربوطه برای آن است . برای اطلاعات بیشتر به واکشی HTTP-redirect مراجعه کنید .
مراحل دریافت fetchStartکننده عبارتند از تبدیل واکشی مُهر زمانی برای زمان شروع پس از تغییر مسیر این اطلاعات زمان و شیء جهانی مربوطه برای این . برای اطلاعات بیشتر به واکشی HTTP مراجعه کنید .
مراحل دریافت domainLookupStartکننده جزوه زمان سنجی ارتند از تبدیل واکشی مُهر زمان برای این اطلاعات زمانبندی زمان شروع جستجوی دامنه اطلاعات زمانبندی اتصال نهایی و شیء جهانی مربوطه برای این کار . برای اطلاعات بیشتر به اطلاعات زمانبندی اتصال ضبط مراجعه کنید .
مراحل دریافت domainLookupEndکننده عبارتند از تبدیل واکشی مُهر زمان برای این اطلاعات زمانبندی اطلاعات زمانبندی اتصال نهایی زمان جستجوی دامنه و شیء جهانی مربوطه برای این . برای اطلاعات بیشتر به اطلاعات زمانبندی اتصال ضبط مراجعه کنید .
مراحل دریافت connectStartکننده عبارتند از تبدیل واکشی مُهر زمان برای این اطلاعات زمانبندی زمان شروع اتصال اطلاعات زمانبندی نهایی اتصال و شیء جهانی مربوطه برای این . برای اطلاعات بیشتر به اطلاعات زمانبندی اتصال ضبط مراجعه کنید .
مراحل دریافت connectEndکننده عبارتند از تبدیل واکشی مُهر زمانی برای این اطلاعات زمانبندی ، زمان پایان اتصال اطلاعات زمانبندی نهایی اتصال و شیء جهانی مربوطه برای این کار . برای اطلاعات بیشتر به اطلاعات زمانبندی اتصال ضبط مراجعه کنید .
مراحل دریافت secureConnectionStartکننده عبارتند از تبدیل واکشی مُهر زمانی برای این اطلاعات زمانبندی ، زمان شروع اتصال ایمن اطلاعات زمانبندی اتصال و شیء جهانی مربوطه برای این کار . برای اطلاعات بیشتر به اطلاعات زمانبندی اتصال ضبط مراجعه کنید .
مراحل nextHopProtocolدریافت کننده عبارتند از رمزگشایی ایزومورفیک این اطلاعات زمانبندی اطلاعات زمانبندی نهایی اتصال پروتکل مذاکره شده ALPN . برای اطلاعات بیشتر به اطلاعات زمانبندی اتصال ضبط مراجعه کنید .
توجه داشته باشید
شماره 221 پیشنهاد می‌کند که پشتیبانی از nextHopProtocol حذف شود، زیرا می‌تواند جزئیات مربوط به پیکربندی شبکه کاربر را فاش کند.
مراحل requestStartدریافت‌کننده تبدیل واکشی مُهر زمانی برای زمان شروع درخواست شبکه نهایی اطلاعات زمانبندی و شی جهانی مربوطه برای این است . برای اطلاعات بیشتر به واکشی HTTP مراجعه کنید .
مراحل دریافت responseStartکننده عبارتند از تبدیل واکشی مُهر زمانی جزوه زمان سنجی این اطلاعات زمانبندی ، زمان شروع پاسخ نهایی شبکه و شیء جهانی مربوطه برای این . برای اطلاعات بیشتر به واکشی HTTP مراجعه کنید .
مراحل دریافت responseEndکننده عبارتند از تبدیل واکشی مُهر زمانی برای زمان پایان اطلاعات زمان این و شیء جهانی مربوطه برای این . برای اطلاعات بیشتر به واکشی مراجعه کنید .
مراحل دریافت کننده عبارت است encodedBodySizeاز برگرداندن اندازه کدگذاری شده اطلاعات این منبع .
مراحل دریافت کننده عبارتند از decodedBodySizeبرگرداندن اندازه رمزگشایی شده اطلاعات این منبع .
مراحل transferSizeدریافت کننده انجام مراحل زیر است:
اگر حالت کش این ” ” است ، 0 را برگردانید. local
اگر حالت کش این ” ” است ، 300 را برگردانید. validated
این اطلاعات بدنه پاسخ را به اندازه کدگذاری شده به اضافه 300 برگردانید .
توجه داشته باشید
عدد ثابتی که به آن اضافه می transferSizeشود، جایگزین نمایش اندازه کل بایت سرصفحه های HTTP می شود، زیرا ممکن است وجود کوکی های خاصی را نشان دهد. این موضوع را ببینید .
مراحل دریافت کننده این است که وضعیت پاسخ راresponseStatus برگردانید .
توجه داشته باشید
responseStatusدر Fetch تعیین می شود . برای درخواست no-cors با منبع متقاطع، 0 خواهد بود زیرا پاسخ یک پاسخ فیلتر شده مات خواهد بود .
اگر رندر مسدود کردن اطلاعات زمانبندی جزوه زمان سنجی باشد، مراحل دریافت‌کننده renderBlockingStatusبازگشت هستند . در غیر این صورت . blockingnon-blocking
توجه داشته باشید
یک عامل کاربر “”{
“”,
“-”
};
:
-[ PERFORMANCE-TIMELINE-2 ] :
{
();
();
;
};
[HR-TIME-2] :
:
فهرست مطالب