بهبود زمان راه اندازی DevTools

ماکسیم صدیم
Maksim Sadym

راه اندازی DevTools اکنون 13٪ سریعتر است (از 11.2 به 10 ثانیه)

TL;DR; نتیجه با حذف یک سریال اضافی به دست می آید.

بررسی اجمالی

هنگامی که DevTools در حال راه اندازی است، باید با موتور جاوا اسکریپت V8 تماس برقرار کند.

فرآیند راه اندازی DevTools

مکانیزمی که Chromium برای ارسال دستورات DevTools به V8 (و به طور کلی برای IPC) استفاده می کند، mojo نامیده می شود. هم تیمی های من Benedikt Meurer و Sigurd Schneider در حین کار بر روی کار دیگری متوجه ناکارآمدی شدند و با حذف دو مرحله اضافی در نحوه ارسال و دریافت این پیام ها، ایده ای برای بهبود روند ایجاد کردند.

اجازه دهید به نحوه عملکرد مکانیسم mojo بپردازیم!

مکانیسم های mojo

مکانیسم های موجو

یک دستور mojo EvaluateScript وجود دارد که دستور JS را اجرا می کند. کل دستور JS از جمله arguments در رشته ای از کد منبع جاوا اسکریپت که می تواند eval() باشد، سریال می کند. همانطور که ممکن است تصور کنید، این رشته ها می توانند بسیار بلند و گران شوند. پس از دریافت دستور توسط V8، این رشته‌ها از کد جاوا اسکریپت قبل از اجرا از حالت سریال خارج می‌شوند. این فرآیند سریال‌سازی و سریال‌زدایی برای هر پیام منفرد، سربار قابل‌توجهی ایجاد می‌کند.

بندیکت مورر متوجه شد که سریال‌سازی و سریال‌زدایی arguments بسیار پرهزینه است و کل مراحل «Serialize JS command to string JS» و «Deserialize JS string» اضافی هستند و می‌توان آنها را نادیده گرفت.

جزئیات فنی: RenderFrameHostImpl::ExecuteJavaScript

چقدر پیشرفت کردیم

مکانیسم های بهبود یافته

ما یک متد mojo API دیگر را معرفی کردیم که به ما اجازه می‌دهد به جای ایجاد رشته کد منبع جاوا اسکریپت، نام شی، روشی که باید فراخوانی می‌شود و فهرست آرگومان‌ها را مستقیماً ارسال کنیم. این به ما امکان می‌دهد از سریال‌سازی و سریال‌زدایی صرف‌نظر کنیم، و نیاز به تجزیه کد جاوا اسکریپت را برطرف می‌کند.

برای جزئیات فنی در مورد نحوه اجرای این بهینه سازی، به این دو وصله مراجعه کنید:

  1. CL 2431864: [devtools] کاهش سربار عملکرد ارسال پیام در قسمت جلویی
  2. CL 2442012: [devtools] از ExecuteJavaScriptMethod در DevTools استفاده کنید

تأثیر

برای اندازه‌گیری اثربخشی تغییر، برخی از اندازه‌گیری‌ها را با مقایسه نسخه‌های Chromium cb971089a058 و 4f213b39d581 (قبل و بعد از تغییر) انجام دادیم.

برای هر دو ویرایش، سناریوی زیر را 5 بار اجرا کردیم:

  1. ردیابی را با استفاده از chrome://tracing ضبط کنید
  2. DevTools-on-DevTools را باز کنید
  3. ردیابی ثبت شده CrRendererMain را دریافت کنید و معیارهای ویژه V8 را مقایسه کنید.

بر اساس این آزمایش‌ها، DevTools با بهینه‌سازی، 13 درصد سریع‌تر باز می‌شود (از 11.2 ثانیه به 10 ثانیه) .

نکات برجسته، مدت زمان CPU

نام روش بهینه نشده (ms) بهینه شده (ms) تفاوت ها (ms) بهبود سرعت (%)
جمع 11,213.19 9,953.99 -1259.20 12.65٪
v8.run 499.67 3.61 -496.06 12.65٪
V8.Execute 1,654.87 1,349.61 -305.25 3.07٪
v8.callFunction 1,171.84 1,339.77 167.94 -1.69٪
v8.compile 133.93 3.56 -130.37 1.31٪

زمان بارگیری CPU توسط DevTools (ms)

جدول مقایسه معیارهای ردیابی کامل

در نتیجه، DevTools با استفاده از CPU کمتر باز می‌شود و سریع‌تر کار می‌کند . 🎉

کانال های پیش نمایش را دانلود کنید

استفاده از Chrome Canary ، Dev یا Beta را به عنوان مرورگر توسعه پیش‌فرض خود در نظر بگیرید. این کانال‌های پیش‌نمایش به شما امکان می‌دهند به جدیدترین ویژگی‌های DevTools دسترسی داشته باشید، APIهای پلت‌فرم وب پیشرفته را آزمایش کنید و قبل از اینکه کاربرانتان این کار را انجام دهند، مشکلات موجود در سایت خود را پیدا کنید!

تماس با تیم Chrome DevTools

از گزینه های زیر برای بحث در مورد ویژگی ها و تغییرات جدید در پست یا هر چیز دیگری مربوط به DevTools استفاده کنید.

  • پیشنهاد یا بازخورد خود را از طریق crbug.com برای ما ارسال کنید.
  • با استفاده از گزینه های بیشتر ، مشکل DevTools را گزارش کنیدبیشتر > راهنما > گزارش مشکلات DevTools در DevTools.
  • توییت در @ChromeDevTools .
  • نظرات خود را در مورد ویدیوهای YouTube DevTools یا نکات DevTools در YouTube ما بنویسید.
،

ماکسیم صدیم
Maksim Sadym

راه اندازی DevTools اکنون 13٪ سریعتر است (از 11.2 به 10 ثانیه)

TL;DR; نتیجه با حذف یک سریال اضافی به دست می آید.

بررسی اجمالی

هنگامی که DevTools در حال راه اندازی است، باید با موتور جاوا اسکریپت V8 تماس برقرار کند.

فرآیند راه اندازی DevTools

مکانیزمی که Chromium برای ارسال دستورات DevTools به V8 (و به طور کلی برای IPC) استفاده می کند، mojo نامیده می شود. هم تیمی های من Benedikt Meurer و Sigurd Schneider در حین کار بر روی کار دیگری متوجه ناکارآمدی شدند و با حذف دو مرحله اضافی در نحوه ارسال و دریافت این پیام ها، ایده ای برای بهبود روند ایجاد کردند.

اجازه دهید به نحوه عملکرد مکانیسم mojo بپردازیم!

مکانیسم های mojo

مکانیسم های موجو

یک دستور mojo EvaluateScript وجود دارد که دستور JS را اجرا می کند. کل دستور JS از جمله arguments در رشته ای از کد منبع جاوا اسکریپت که می تواند eval() باشد، سریال می کند. همانطور که ممکن است تصور کنید، این رشته ها می توانند بسیار بلند و گران شوند. پس از دریافت دستور توسط V8، این رشته‌ها از کد جاوا اسکریپت قبل از اجرا از حالت سریال خارج می‌شوند. این فرآیند سریال‌سازی و سریال‌زدایی برای هر پیام منفرد، سربار قابل‌توجهی ایجاد می‌کند.

بندیکت مورر متوجه شد که سریال‌سازی و سریال‌زدایی arguments بسیار پرهزینه است و کل مراحل «Serialize JS command to string JS» و «Deserialize JS string» اضافی هستند و می‌توان آنها را نادیده گرفت.

جزئیات فنی: RenderFrameHostImpl::ExecuteJavaScript

چقدر پیشرفت کردیم

مکانیسم های بهبود یافته

ما یک متد mojo API دیگر را معرفی کردیم که به ما اجازه می‌دهد به جای ایجاد رشته کد منبع جاوا اسکریپت، نام شی، روشی که باید فراخوانی می‌شود و فهرست آرگومان‌ها را مستقیماً ارسال کنیم. این به ما امکان می‌دهد از سریال‌سازی و سریال‌زدایی صرف‌نظر کنیم، و نیاز به تجزیه کد جاوا اسکریپت را برطرف می‌کند.

برای جزئیات فنی در مورد نحوه اجرای این بهینه سازی، به این دو وصله مراجعه کنید:

  1. CL 2431864: [devtools] کاهش سربار عملکرد ارسال پیام در قسمت جلویی
  2. CL 2442012: [devtools] از ExecuteJavaScriptMethod در DevTools استفاده کنید

تأثیر

برای اندازه‌گیری اثربخشی تغییر، برخی از اندازه‌گیری‌ها را با مقایسه نسخه‌های Chromium cb971089a058 و 4f213b39d581 (قبل و بعد از تغییر) انجام دادیم.

برای هر دو ویرایش، سناریوی زیر را 5 بار اجرا کردیم:

  1. ردیابی را با استفاده از chrome://tracing ضبط کنید
  2. DevTools-on-DevTools را باز کنید
  3. ردیابی ثبت شده CrRendererMain را دریافت کنید و معیارهای ویژه V8 را مقایسه کنید.

بر اساس این آزمایش‌ها، DevTools با بهینه‌سازی، 13 درصد سریع‌تر (از 11.2 به 10 ثانیه) باز می‌شود.

نکات برجسته، مدت زمان CPU

نام روش بهینه نشده (ms) بهینه شده (ms) تفاوت ها (ms) بهبود سرعت (%)
جمع 11,213.19 9,953.99 -1259.20 12.65٪
v8.run 499.67 3.61 -496.06 12.65٪
V8.Execute 1,654.87 1,349.61 -305.25 3.07٪
v8.callFunction 1,171.84 1,339.77 167.94 -1.69٪
v8.compile 133.93 3.56 -130.37 1.31٪

زمان بارگیری CPU توسط DevTools (ms)

جدول مقایسه معیارهای ردیابی کامل

در نتیجه، DevTools با استفاده از CPU کمتر باز می‌شود و سریع‌تر کار می‌کند . 🎉

کانال های پیش نمایش را دانلود کنید

استفاده از Chrome Canary ، Dev یا Beta را به عنوان مرورگر توسعه پیش‌فرض خود در نظر بگیرید. این کانال‌های پیش‌نمایش به شما امکان می‌دهند به جدیدترین ویژگی‌های DevTools دسترسی داشته باشید، APIهای پلت‌فرم وب پیشرفته را آزمایش کنید و قبل از اینکه کاربرانتان این کار را انجام دهند، مشکلات موجود در سایت خود را پیدا کنید!

تماس با تیم Chrome DevTools

از گزینه های زیر برای بحث در مورد ویژگی ها و تغییرات جدید در پست یا هر چیز دیگری مربوط به DevTools استفاده کنید.

  • پیشنهاد یا بازخورد خود را از طریق crbug.com برای ما ارسال کنید.
  • با استفاده از گزینه های بیشتر ، مشکل DevTools را گزارش کنیدبیشتر > راهنما > گزارش مشکلات DevTools در DevTools.
  • توییت در @ChromeDevTools .
  • نظرات خود را در مورد ویدیوهای YouTube DevTools یا نکات DevTools Tips ما بگذارید.