এই পৃষ্ঠাটি Cloud Translation API অনুবাদ করেছে।

DevTools এ নতুন কি আছে (Chrome 68)

Kayce Basques

Chrome 68-এ DevTools-এ নতুন:

আগ্রহী মূল্যায়ন . আপনি এক্সপ্রেশন টাইপ করার সাথে সাথে কনসোল ফলাফলের পূর্বরূপ দেখায়।
যুক্তি ইঙ্গিত . আপনি ফাংশন টাইপ করার সাথে সাথে কনসোল আপনাকে সেই ফাংশনের জন্য প্রত্যাশিত আর্গুমেন্ট দেখায়।
ফাংশন স্বয়ংসম্পূর্ণতা । document.querySelector('p') এর মতো একটি ফাংশন কল টাইপ করার পরে, কনসোল আপনাকে সেই ফাংশন এবং বৈশিষ্ট্যগুলি দেখায় যা রিটার্ন মান সমর্থন করে।
কনসোলে ES2017 কীওয়ার্ড । await মত কীওয়ার্ড এখন কনসোলের স্বয়ংসম্পূর্ণ UI-তে উপলব্ধ।
অডিট প্যানেলে বাতিঘর 3.0 দ্রুত, আরও সামঞ্জস্যপূর্ণ অডিট, একটি নতুন UI এবং নতুন অডিট৷
BigInt সমর্থন । কনসোলে জাভাস্ক্রিপ্টের নতুন নির্ভুল-নির্ভুল পূর্ণসংখ্যা ব্যবহার করে দেখুন।
ওয়াচ প্যানে সম্পত্তি পাথ যোগ করা হচ্ছে । স্কোপ প্যান থেকে ওয়াচ প্যানে বৈশিষ্ট্য যোগ করুন।
"টাইমস্ট্যাম্প দেখান" সেটিংসে সরানো হয়েছে ৷

দ্রষ্টব্য: chrome://version এ আপনি Chrome এর কোন সংস্করণটি চালাচ্ছেন তা পরীক্ষা করুন৷ আপনি যদি একটি পূর্ববর্তী সংস্করণ চালাচ্ছেন তবে এই বৈশিষ্ট্যগুলি বিদ্যমান থাকবে না৷ আপনি যদি পরবর্তী সংস্করণ চালান তবে এই বৈশিষ্ট্যগুলি পরিবর্তিত হতে পারে৷ Chrome প্রতি 6 সপ্তাহে একটি নতুন প্রধান সংস্করণে স্বয়ংক্রিয়ভাবে আপডেট হয়।

নিচে রিলিজ নোটের ভিডিও সংস্করণ পড়ুন বা দেখুন।

সহায়ক কনসোল

Chrome 68 স্বয়ংসম্পূর্ণতা এবং পূর্বরূপের সাথে সম্পর্কিত কয়েকটি নতুন কনসোল বৈশিষ্ট্য সহ প্রেরণ করে।

আগ্রহী মূল্যায়ন

আপনি যখন কনসোলে একটি অভিব্যক্তি টাইপ করেন, তখন কনসোল এখন আপনার কার্সারের নীচে সেই অভিব্যক্তিটির ফলাফলের একটি পূর্বরূপ দেখাতে পারে।

সর্ট() অপারেশনের ফলাফল স্পষ্টভাবে সম্পাদিত হওয়ার আগে কনসোল প্রিন্ট করছে।

চিত্র 1 . sort() অপারেশনের ফলাফল স্পষ্টভাবে কার্যকর করার আগে কনসোল মুদ্রণ করছে

আগ্রহী মূল্যায়ন সক্ষম করতে:

কনসোল খুলুন।
কনসোল সেটিংস খুলুন .
আগ্রহী মূল্যায়ন চেকবক্স সক্ষম করুন।

অভিব্যক্তি পার্শ্ব প্রতিক্রিয়া সৃষ্টি করলে DevTools মূল্যায়ন করতে আগ্রহী হয় না।

যুক্তি ইঙ্গিত

আপনি যখন ফাংশন টাইপ করছেন, কনসোল এখন আপনাকে সেই আর্গুমেন্টগুলি দেখায় যা ফাংশনটি প্রত্যাশা করে।

কনসোলে আর্গুমেন্ট ইঙ্গিত।

চিত্র ২ . কনসোলে আর্গুমেন্ট ইঙ্গিতের বিভিন্ন উদাহরণ

মন্তব্য:

একটি arg-এর আগে একটি প্রশ্ন চিহ্ন, যেমন ?options , একটি ঐচ্ছিক আর্গের প্রতিনিধিত্ব করে৷
একটি arg-এর আগে একটি উপবৃত্ত, যেমন ...items , একটি স্প্রেডের প্রতিনিধিত্ব করে।
কিছু ফাংশন, যেমন CSS.supports() , একাধিক আর্গুমেন্ট স্বাক্ষর গ্রহণ করে।

ফাংশন নির্বাহের পরে স্বয়ংসম্পূর্ণ

Eager Evaluation সক্ষম করার পর, কনসোল এখন আপনাকে দেখায় যে আপনি একটি ফাংশন টাইপ করার পরে কোন বৈশিষ্ট্য এবং ফাংশন উপলব্ধ।

document.querySelector('p') চালানোর পরে, কনসোল এখন আপনাকে সেই উপাদানটির জন্য উপলব্ধ বৈশিষ্ট্য এবং ফাংশনগুলি দেখাতে পারে।

চিত্র 3 । উপরের স্ক্রিনশটটি পুরানো আচরণের প্রতিনিধিত্ব করে এবং নীচের স্ক্রিনশটটি নতুন আচরণের প্রতিনিধিত্ব করে যা ফাংশন স্বয়ংসম্পূর্ণতাকে সমর্থন করে

ES2017 কীওয়ার্ড স্বয়ংসম্পূর্ণ

ES2017 কীওয়ার্ড, যেমন await , এখন কনসোলের স্বয়ংসম্পূর্ণ UI-তে উপলব্ধ।

কনসোল এখন তার স্বয়ংসম্পূর্ণ UI-তে 'অপেক্ষা' করার পরামর্শ দেয়।

চিত্র 4 । কনসোল এখন তার স্বয়ংসম্পূর্ণ UI এ await পরামর্শ দেয়

দ্রুত, আরো নির্ভরযোগ্য অডিট, একটি নতুন UI, এবং নতুন অডিট

Lighthouse 3.0 সহ Chrome 68 জাহাজ। পরবর্তী বিভাগগুলি হল সবচেয়ে বড় কিছু পরিবর্তনের একটি রাউন্ডআপ। সম্পূর্ণ গল্পের জন্য বাতিঘর 3.0 ঘোষণা করা দেখুন।

দ্রুত, আরো নির্ভরযোগ্য অডিট

লাইটহাউস 3.0-এর একটি নতুন অভ্যন্তরীণ অডিটিং ইঞ্জিন রয়েছে, যার কোডনাম ল্যান্টার্ন, যা আপনার অডিটগুলি দ্রুত সম্পন্ন করে এবং রানের মধ্যে কম পার্থক্য সহ।

নতুন UI

Lighthouse 3.0 এছাড়াও একটি নতুন UI নিয়ে আসে, Lighthouse এবং Chrome UX (গবেষণা ও ডিজাইন) টিমের মধ্যে সহযোগিতার জন্য ধন্যবাদ৷

Lighthouse 3.0-এ নতুন রিপোর্ট UI।

চিত্র 5 । Lighthouse 3.0-এ নতুন রিপোর্ট UI

নতুন অডিট

Lighthouse 3.0 এছাড়াও 4টি নতুন অডিট সহ পাঠানো হয়েছে:

প্রথম কনটেন্টফুল পেইন্ট
robots.txt বৈধ নয়
অ্যানিমেটেড কন্টেন্টের জন্য ভিডিও ফরম্যাট ব্যবহার করুন
যেকোন উৎসের একাধিক, ব্যয়বহুল রাউন্ড ট্রিপ এড়িয়ে চলুন

BigInt সমর্থন

Chrome 68 BigInt নামে একটি নতুন সংখ্যাসূচক আদিম সমর্থন করে। BigInt আপনাকে নির্বিচারে নির্ভুলতার সাথে পূর্ণসংখ্যা উপস্থাপন করতে দেয়। কনসোলে এটি ব্যবহার করে দেখুন:

কনসোলে BigInt এর একটি উদাহরণ।

চিত্র 6 । কনসোলে BigInt এর একটি উদাহরণ

দেখার জন্য সম্পত্তি পাথ যোগ করুন

ব্রেকপয়েন্টে বিরাম দেওয়ার সময়, স্কোপ প্যানে একটি প্রপার্টিতে ডান-ক্লিক করুন এবং ওয়াচ প্যানে সেই প্রপার্টি যোগ করতে ঘড়ির জন্য প্রপার্টি পাথ যোগ করুন নির্বাচন করুন।

দেখার জন্য সম্পত্তি পাথ যোগ করার একটি উদাহরণ।

চিত্র 7 । দেখার জন্য সম্পত্তি পাথ যোগ করার একটি উদাহরণ

"টাইমস্ট্যাম্প দেখান" সেটিংসে সরানো হয়েছে৷

কনসোল সেটিংসে পূর্বে টাইমস্ট্যাম্প চেকবক্স দেখান সেটিংসে চলে গেছে।

প্রিভিউ চ্যানেল ডাউনলোড করুন

আপনার ডিফল্ট ডেভেলপমেন্ট ব্রাউজার হিসেবে Chrome Canary , Dev বা Beta ব্যবহার করার কথা বিবেচনা করুন। এই পূর্বরূপ চ্যানেলগুলি আপনাকে সর্বশেষ DevTools বৈশিষ্ট্যগুলিতে অ্যাক্সেস দেয়, অত্যাধুনিক ওয়েব প্ল্যাটফর্ম API পরীক্ষা করে এবং আপনার ব্যবহারকারীদের আগে আপনার সাইটে সমস্যাগুলি খুঁজে পায়!

Chrome DevTools টিমের সাথে যোগাযোগ করা হচ্ছে

পোস্টের নতুন বৈশিষ্ট্য এবং পরিবর্তনগুলি বা DevTools সম্পর্কিত অন্য কিছু নিয়ে আলোচনা করতে নিম্নলিখিত বিকল্পগুলি ব্যবহার করুন৷

crbug.com এর মাধ্যমে আমাদের কাছে একটি পরামর্শ বা প্রতিক্রিয়া জমা দিন।
আরও বিকল্প ব্যবহার করে একটি DevTools সমস্যা রিপোর্ট করুন > সাহায্য > DevTools-এ একটি DevTools সমস্যা রিপোর্ট করুন ।
@ChromeDevTools- এ টুইট করুন।
আমাদের DevTools YouTube ভিডিও বা DevTools টিপস YouTube ভিডিওগুলিতে নতুন কী আছে সে সম্পর্কে মন্তব্য করুন৷