DevTools স্টার্টআপ এখন ~13% দ্রুত 🎉 (11.2s থেকে 10s পর্যন্ত)
TL;DR; একটি অপ্রয়োজনীয় সিরিয়ালাইজেশন অপসারণ করে ফলাফল অর্জন করা হয়।
ওভারভিউ
যখন DevTools শুরু হচ্ছে, তখন এটিকে V8 JavaScript ইঞ্জিনে কিছু কল করতে হবে।
V8 (এবং সাধারণভাবে IPC-এর জন্য) DevTools কমান্ড পাঠাতে Chromium যে পদ্ধতি ব্যবহার করে তাকে বলা হয় mojo । আমার সতীর্থ বেনেডিক্ট মুয়ারার এবং সিগার্ড স্নাইডার অন্য একটি টাস্কে কাজ করার সময় একটি অদক্ষতা আবিষ্কার করেছিলেন এবং এই বার্তাগুলি কীভাবে পাঠানো এবং গ্রহণ করা হয় তার দুটি অপ্রয়োজনীয় পদক্ষেপগুলি সরিয়ে প্রক্রিয়াটিকে উন্নত করার একটি ধারণা নিয়ে এসেছিল৷
mojo মেকানিজম কীভাবে কাজ করে তা নিয়ে আসুন!
mojo মেকানিজম
একটি mojo কমান্ড EvaluateScript আছে যা JS কমান্ড চালায়। এটি জাভাস্ক্রিপ্ট সোর্স কোডের একটি স্ট্রিংয়ে arguments সহ পুরো JS কমান্ডকে সিরিয়ালাইজ করে যা eval() হতে পারে। আপনি কল্পনা করতে পারেন, এই স্ট্রিংগুলি বেশ দীর্ঘ এবং ব্যয়বহুল হতে পারে। V8 দ্বারা কমান্ডটি পাওয়ার পরে, জাভাস্ক্রিপ্ট কোডের এই স্ট্রিংগুলি চালানোর আগে ডিসিরিয়ালাইজ করা হয়। প্রতিটি একক বার্তার জন্য সিরিয়ালাইজিং এবং ডিসিরিয়ালাইজ করার এই প্রক্রিয়াটি উল্লেখযোগ্য ওভারহেড তৈরি করে।
বেনেডিক্ট মিউর বুঝতে পেরেছিলেন যে arguments সিরিয়ালাইজেশন এবং ডিসিরিয়ালাইজেশন বেশ ব্যয়বহুল, এবং পুরো "জেএস স্ট্রিংকে সিরিয়ালাইজ জেএস কমান্ড" এবং "জেএস স্ট্রিং ডিসিরিয়ালাইজ" পদক্ষেপগুলি অপ্রয়োজনীয় এবং এড়িয়ে যাওয়া যেতে পারে।
প্রযুক্তিগত বিবরণ: RenderFrameHostImpl::ExecuteJavaScript
আমরা কিভাবে উন্নতি করেছি
জাভাস্ক্রিপ্ট সোর্স কোডের স্ট্রিং তৈরি করার পরিবর্তে আমরা আরেকটি মোজো API পদ্ধতি চালু করেছি যা আমাদের বস্তুর নাম, কল করার পদ্ধতি এবং আর্গুমেন্টের তালিকা সরাসরি পাস করতে দেয়। এটি আমাদের সিরিয়ালাইজেশন এবং ডিসিরিয়ালাইজেশন এড়িয়ে যেতে দেয় এবং জাভাস্ক্রিপ্ট কোড পার্স করার প্রয়োজনীয়তা দূর করে।
আমরা কীভাবে এই অপ্টিমাইজেশানটি প্রয়োগ করেছি তার প্রযুক্তিগত বিশদ বিবরণের জন্য, এই দুটি প্যাচগুলি দেখুন:
- CL 2431864: [devtools] ফ্রন্ট-এন্ডে বার্তা প্রেরণের ওভারহেড কর্মক্ষমতা হ্রাস করে
- CL 2442012: [devtools] DevTools-এ
ExecuteJavaScriptMethodব্যবহার করুন
প্রভাব
পরিবর্তনের কার্যকারিতা পরিমাপ করার জন্য, আমরা Chromium সংশোধন cb971089a058 এবং 4f213b39d581 (পরিবর্তনের আগে এবং পরে) তুলনা করে কিছু পরিমাপ চালিয়েছি।
উভয় সংশোধনের জন্য, আমরা নিম্নোক্ত দৃশ্যকল্পটি 5 বার চালিয়েছি:
-
chrome://tracingব্যবহার করে ট্রেস রেকর্ড করুন - DevTools-on-DevTools খুলুন
- রেকর্ড করা
CrRendererMainট্রেস পান এবং V8-নির্দিষ্ট মেট্রিক্স তুলনা করুন।
এই পরীক্ষাগুলির উপর ভিত্তি করে, DevTools অপ্টিমাইজেশানের সাথে ~13% দ্রুত (11.2s থেকে 10s পর্যন্ত) খোলে।
হাইলাইট, CPU সময়কাল
| পদ্ধতির নাম | অপ্টিমাইজ করা হয়নি (ms) | অপ্টিমাইজ করা (ms) | পার্থক্য (ms) | গতির উন্নতি (%) |
| মোট | 11,213.19 | 9,953.99 | -1,259.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% |
সম্পূর্ণ ট্রেসিং মেট্রিক্স তুলনা টেবিল
ফলস্বরূপ, DevTools খোলে এবং কম CPU ব্যবহারে দ্রুত কাজ করে । 🎉
প্রিভিউ চ্যানেল ডাউনলোড করুন
আপনার ডিফল্ট ডেভেলপমেন্ট ব্রাউজার হিসেবে Chrome Canary , Dev বা Beta ব্যবহার করার কথা বিবেচনা করুন। এই পূর্বরূপ চ্যানেলগুলি আপনাকে সর্বশেষ DevTools বৈশিষ্ট্যগুলিতে অ্যাক্সেস দেয়, অত্যাধুনিক ওয়েব প্ল্যাটফর্ম API পরীক্ষা করে এবং আপনার ব্যবহারকারীদের আগে আপনার সাইটে সমস্যাগুলি খুঁজে পায়!
Chrome DevTools টিমের সাথে যোগাযোগ করা হচ্ছে
পোস্টের নতুন বৈশিষ্ট্য এবং পরিবর্তনগুলি বা DevTools সম্পর্কিত অন্য কিছু নিয়ে আলোচনা করতে নিম্নলিখিত বিকল্পগুলি ব্যবহার করুন৷
- crbug.com এর মাধ্যমে আমাদের কাছে একটি পরামর্শ বা প্রতিক্রিয়া জমা দিন।
- আরও বিকল্প ব্যবহার করে একটি DevTools সমস্যা রিপোর্ট করুন
> সাহায্য > DevTools-এ একটি DevTools সমস্যা রিপোর্ট করুন । - @ChromeDevTools- এ টুইট করুন।
- আমাদের DevTools YouTube ভিডিও বা DevTools টিপস YouTube ভিডিওগুলিতে নতুন কী আছে সে সম্পর্কে মন্তব্য করুন৷