DevTools Digest - ফিল্ম স্ট্রিপ এবং থ্রোটলিং এর জন্য একটি নতুন বাড়ি৷

DevTools খবর, যতটা তাজা হয়

এই পোস্টে প্রথম সংবাদ আইটেম একটি সামান্য মেটা - এটা এই আপডেট নিজেই! প্রতি মাসে একবার হলেও, আমি ক্রোম ডেভটুলস-এর জগতে কী ঘটছে তা সংক্ষিপ্ত করব, প্রেস থেকে তাজা।

এবং যখন আমি তাজা বলি, তখন আমি বলতে চাচ্ছি: আমি নতুন বৈশিষ্ট্যগুলি সম্পর্কে কথা বলব যা সবেমাত্র Chrome Canary এ এসেছে, তাই আপনি যদি স্থিতিশীল দেশে থাকতে চান তবে এটিও দুর্দান্ত। তবে আপনি যদি দুঃসাহসিক হন এবং শীর্ষে থাকতে চান তবে এই পোস্টগুলি আপনার জন্য। সাম্প্রতিক বৈশিষ্ট্য এবং বাগ ফিক্স ছাড়াও, আপনি প্রতিটি পোস্টের শেষে একটি কমিউনিটি হার্টবিট বিভাগ পাবেন, যেখানে আপনি, আমাদের প্রিয় ব্যবহারকারীরা যে অবদান রেখেছেন তা হাইলাইট করে।

আর কিছু না করে, আসল খবরে ডুব দেওয়া যাক।


DevTools-এ নতুন

নেটওয়ার্ক এবং টাইমলাইনে ফিল্মের স্ট্রিপের মতো স্ক্রিনশট

মাত্র এক সপ্তাহ আগে, আমরা পরীক্ষা-নিরীক্ষার বাইরে একটি উল্লেখযোগ্য নতুন বৈশিষ্ট্য সরিয়ে নিয়েছি: নেটওয়ার্ক এবং টাইমলাইন ট্যাবে পৃষ্ঠার স্ক্রিনশট ক্যাপচার করার ক্ষমতা।

নেটওয়ার্ক প্যানেলে , ফ্রেমের ক্যাপচারিং সক্ষম করতে ছোট ক্যামেরা আইকনে ক্লিক করুন, তারপর ক্যাপচার ট্রিগার করতে পৃষ্ঠাটি পুনরায় লোড করুন৷ WebPageTest এর মতো অন্যান্য টুলের মাধ্যমে ক্যাপচার করা স্ক্রিনশটগুলি ছাড়া, আমরা বর্তমানে শুধুমাত্র সেই ফ্রেমগুলি দেখাই যা আসলে একটি পেইন্ট থেকে এসেছে।

একটি ফ্রেমে ডাবল-ক্লিক করলে একটি জুম করা ভিউ দেখায় (তারপর নেভিগেট করতে বাম/ডান তীর ব্যবহার করুন), তাদের উপর ঘোরানো প্যানেল জুড়ে লাইন এবং টাইমলাইন দেখায় যাতে ফ্রেমটি ঠিক কখন ক্যাপচার করা হয়েছিল, যা আপনাকে লোডের সাথে সম্পর্কযুক্ত করতে দেয়। ক্রম. এটি রেন্ডার-ব্লকিং ওয়েব ফন্টের মতো সাধারণ লোড সমস্যাগুলি ডিবাগিংকে আরও সহজ করে তোলে।

টাইমলাইন প্যানেলে , আপনি উপরের টুলবারে "স্ক্রিনশট" চেকবক্স টগল করে স্ক্রিনশট ক্যাপচারিং সক্ষম করতে পারেন৷ নেটওয়ার্ক প্যানেলের তুলনায় এখানে জিনিসগুলি একটু ভিন্নভাবে কাজ করে: এই ক্ষেত্রে, আমরা যতবার পারি ক্যাপচার করার চেষ্টা করি - প্রকৃত পেইন্ট নির্বিশেষে - একটি লিনিয়ার টাইমস্কেলে বলা স্ক্রিনশটগুলি ড্রপ করতে সক্ষম হতে যা অন্যান্য সারির সাথে সম্পর্কিত টাইমলাইন। একটি পূর্বরূপ দেখানোর জন্য ডাবল-ক্লিক করার প্রয়োজনের পরিবর্তে, জুম করা ফ্রেমগুলি হোভারে প্রদর্শিত হবে৷

যেহেতু দুটি কার্যকারিতা এবং UX এর ক্ষেত্রে সিঙ্কের বাইরে, তাই আমরা আপনাকে বৈশিষ্ট্য(গুলি) চেষ্টা করে দেখতে এবং crbug.com/new- এ টিকিটের মাধ্যমে বা @ টুইট করার মাধ্যমে আপনার মতামত প্রদান করতে উত্সাহিত করতে চাই ChromeDevTools

নেটওয়ার্ক প্যানেলে নেটওয়ার্ক থ্রটলিং

নেটওয়ার্ক থ্রটলিং , একটি বৈশিষ্ট্য যা আমরা আমাদের ডিভাইস মোড প্রবর্তন করার সময় যোগ করেছি, নেটওয়ার্ক প্যানেল টুলবারে এটির দ্বিতীয় বাড়ি খুঁজে পেয়েছে যাতে আপনি একক জায়গায় নেটওয়ার্ক অপ্টিমাইজেশানগুলিতে ফোকাস করতে পারেন৷

অ্যাকশনে নেটওয়ার্ক থ্রোটলিং

যদিও এই নতুন বাড়িটি কেবল একটি আয়না: এটি এখনও ডিভাইস মোডের বাইরে উপলব্ধ, কারণ আপনার সাইটকে প্রতিক্রিয়াশীল করার জন্য কাজ করার সময় খারাপ সংযোগের অনুকরণ করা এখনও অত্যন্ত গুরুত্বপূর্ণ।

অবশেষে, আপনি কি এই দরিদ্র আত্মাদের মধ্যে একজন যারা ভাবছেন কেন আপনার ইন্টারনেট সংযোগ বিচ্ছিন্ন হয়ে গেছে দীর্ঘ দিন কাজের পরে, শুধুমাত্র আবিষ্কার করার জন্য যে আপনি নেটওয়ার্ক থ্রটলিং অক্ষম করতে ভুলে গেছেন? নেটওয়ার্ক প্যানেল ট্যাব এখন একটি সতর্কতা আইকন দেখায় যখন নেটওয়ার্ক থ্রটলিং সক্ষম করা হয়।

বিভিন্ন খবর


কমিউনিটি হার্টবিট

Chrome DevTools দিয়ে ডাউন এবং নোংরা

অ্যাকশনে নেটওয়ার্ক থ্রোটলিং

ব্রেট লিটল এই চমৎকার ছোট্ট ওয়াকথ্রু কোর্সটি প্রকাশ করেছে যা আপনাকে মৌলিক DevTools কার্যকারিতার সাথে পরিচিত করে কিন্তু অনেক গভীর-তথ্য ও কৌশলও অফার করে। সেখানে নিশ্চিতভাবে দরকারী তথ্য, এবং আরও বেশি DevTools ডক্স কখনও আঘাত করে না!

একটি DevTools IDE…?!

কেনেথ অচেনবার্গ, ওয়েব ডেভেলপার এবং DevTools অনুরাগী, কয়েক মাস আগে একটি প্রুফ-অফ-কনসেপ্টের স্বতন্ত্র DevTools অ্যাপ তৈরি করেছেন, এবং তার ব্লগ পোস্টটি এই সপ্তাহে আবার (হ্যাকার) খবর তৈরি করেছে।

DevTools কে একটি সম্পূর্ণ বিকশিত IDE-এ পরিণত করা একটি মজার ধারণা, যা আমাদের দলের অনেক সদস্য আগে স্বপ্ন দেখেছেন, তবে এটি মহাকাব্য অনুপাতের একটি প্রকল্পও হবে৷


আপনি কি মনে করেন? DevTools IDE কি একটি পাইপ-স্বপ্ন বা আপনি এটি কাজ করতে দেখতে পারেন? এটা কেমন হওয়া উচিত? আমাদের মন্তব্য জানাতে!

শীঘ্রই আবার দেখা হবে!
Paul Bakaus এবং DevTools টিম