সকলকে হাই, DevTools ডাইজেস্টের শেষ সংস্করণে আমরা শক্তিশালী অ্যাসিঙ্ক্রোনাস কল স্ট্যাক এবং আরও কয়েকটি দেখতে পেয়েছি। এই সংস্করণে, আমরা একটি উন্নত নেটওয়ার্ক প্যানেল ফিল্টারিং (স্বয়ংসম্পূর্ণ সহ), ছায়া DOM সামগ্রীর সাথে সম্পাদনা করার ক্ষমতা, CodeMirror 4 আপডেট এবং আরও অনেক কিছু দেখতে পাব।
নেটওয়ার্ক প্যানেল ফিল্টারিং
আপনি এখন কিছু নির্দিষ্ট ক্ষেত্র যেমন ডোমেন দ্বারা সম্পদ ফিল্টার করতে পারেন। একটি ফিল্টার ফরম্যাট হল: Domain:website.com
। ফিল্টারিং ছাড়াও, আপনি বৈধ ফিল্টার মানগুলির জন্য স্বয়ংসম্পূর্ণ পরামর্শও পান যা আপনার ক্যোয়ারী টাইপ করার সাথে সাথে রিয়েলটাইমে আপডেট হয়। আপনি যখন একটি নির্দিষ্ট ডোমেন দ্বারা পরিবেশিত সমস্ত সংস্থান খুঁজে বের করতে হবে তখন আপনি এটি দরকারী বলে মনে করতে পারেন৷ [ crbubg.com/258421 ]
ছায়া DOM বিষয়বস্তু সম্পাদনা করুন
DevTools সবসময় এলিমেন্টস প্যানেলে নিয়মিত HTML এডিট করতে সক্ষম হয়েছে, এই ক্ষমতাগুলি এখন একটি Shadow DOM-এর এলিমেন্টে প্রসারিত। [ crbug.com/348991 ]
CodeMirror 4.0 এ আপগ্রেড করুন
CodeMirror, জাভাস্ক্রিপ্ট ভিত্তিক টেক্সট এডিটর সোর্স প্যানেলের অংশ হিসাবে ব্যবহার করা হচ্ছে সংস্করণ 4 এ আপগ্রেড করা হয়েছে। এর ফলে একগুচ্ছ নতুন কার্যকারিতা যোগ করা হয়েছে। crbug.com/356878 ]
একটি CSS-সম্পত্তির জন্য দ্রুত অনুসন্ধান করুন
আপনি এখন শৈলী ফলকের নতুন অনুসন্ধান বাক্স থেকে সম্পত্তির নাম, মান বা নিয়ম নির্বাচক অনুসন্ধান করতে পারেন। আপনি আপনার ক্যোয়ারী টাইপ করার সাথে সাথে ফলাফলগুলি রিয়েল-টাইমে হাইলাইট করা হয়। [ crbug.com/278852 ]
কনসোল বার্তার পাশে টাইমস্ট্যাম্প
একটি দ্রুত উত্তরাধিকারসূত্রে বার্তাগুলি লগ করার সময়, একটি বার্তা লগ করার সঠিক সময় দেখতে এটি কার্যকর হতে পারে৷ আপনি DevTools পরীক্ষা-নিরীক্ষার মাধ্যমে এটি সক্ষম করতে পারেন। [ crbug.com/131714 ]
হিপ স্ন্যাপশটের জন্য মেমরি স্ট্যাটিস্টিকস ব্রেকডাউন
একটি রেকর্ড করা হিপ স্ন্যাপশট দেখার সময়, পরিসংখ্যান পাই চার্টটি লক্ষ্য করুন যা জাভাস্ক্রিপ্টের কোন দিকটি সবচেয়ে বেশি মেমরি গ্রহণ করছে তা একটি ভিজ্যুয়াল, রঙ-কোডেড ওভারভিউ দেয়। বর্তমানে একটি পরীক্ষামূলক বৈশিষ্ট্য, এটি চেষ্টা করার জন্য "হিপ স্ন্যাপশট পরিসংখ্যান" সক্ষম করুন৷ [ crbug.com/346335 ]
একটি console.log এর মূল উৎস দেখুন, মোড়ানো সংস্করণ নয়
আপনার সম্ভবত একটি console.log র্যাপার ফাংশন আছে, কিন্তু দুর্ভাগ্যবশত কনসোলে আপনার সমস্ত বার্তা util.js:46 এর মতো কিছু থেকে আসে৷ এখন আপনি DevTools আপনার আসল অবস্থানগুলি সমাধান করতে পারেন৷ DevTools ব্ল্যাকবক্স করতে "নির্দিষ্ট নাম সহ উত্সগুলির মাধ্যমে পদক্ষেপ এড়িয়ে যান" ইনপুট বক্সে কনসোল লগ বার্তাগুলি মোড়ানো ফাইলটি প্রবেশ করান এবং তারপরে একটি লগ স্টেটমেন্টের আসল উত্স দেখান৷ [ crbug.com/231007 ]
আরও কয়েকটি ছোট, কিন্তু শক্তিশালী সংযোজন
জাভাস্ক্রিপ্ট ইভেন্ট শ্রোতাদের গতিশীলভাবে যুক্ত বা সরানোর পরে উপাদান প্যানেলে ইভেন্ট লিসেনার প্যানটি রিফ্রেশ করুন । [ crbug.com/341044 ]
আপনি কনসোল ইনপুটে ফোকাস পেতে
Ctrl+
ব্যবহার করতে পারেন, আপনি DevTools-এ শুধুমাত্র একটি কীবোর্ড ওয়ার্কফ্লোতে এটি দরকারী বলে মনে করতে পারেন। [ crbug.com/144943 ]মানের জন্য বর্ডার-স্টাইল স্বয়ংসম্পূর্ণ পরামর্শগুলি (ডটেড, ড্যাশড, ডবল, গ্রুভ) স্পেকের সাথে মেলে আপডেট করা হয়েছে। [ crbug.com/349998 ]
ডিফল্ট পুনরুদ্ধার করুন এবং পুনরায় লোড বোতাম ** সেটিংস প্যানেলে যোগ করা হয়েছে যা টিনে যা বলে ঠিক তাই করে৷ [ crbug.com/135451 ]
বর্তমানে একটি পরীক্ষামূলক বৈশিষ্ট্য, আপনি আপনার কর্মপ্রবাহের জন্য এর উপযুক্ততা আবিষ্কার করতে বামে ডক ব্যবহার করে দেখতে পারেন। অন্যান্য লেআউট মোডগুলি হল প্রধান উইন্ডোতে ডক (ডান বা নীচে) এবং একটি পৃথক উইন্ডোতে আনডক। [ crbug.com/134282 ]
" হুইল " এখন একটি ইভেন্ট লিসেনার ব্রেকপয়েন্ট হিসেবে অফার করা হয়েছে, এটি সাধারণ ক্লিক, মাউসমোভ, মাউসডাউন ইত্যাদি ইভেন্টের অতিরিক্ত। [ crbug.com/347562 ]
এখন জন্য যে সব, পড়ার জন্য ধন্যবাদ!