- Chrome 62 তাত্ত্বিক ফলাফলের পরিবর্তে প্রকৃত কর্মক্ষমতা মেট্রিক্স প্রদান করে নেটওয়ার্ক তথ্য API কে আরও উপযোগী করে তোলে।
- OpenType ভেরিয়েবল ফন্টের জন্য সমর্থন এসেছে।
- আপনি HTML মিডিয়া উপাদান থেকে মিডিয়া স্ট্রিম ক্যাপচার করতে পারেন.
- আমি একটি গুরুত্বপূর্ণ পরিবর্তন সম্পর্কে একটি বিশেষ অনুস্মারক পেয়েছি যা Chrome 62-এ অবতরণ করছে৷
এবং আরো অনেক আছে!
আমি পিট লেপেজ । চলুন ডুব দিয়ে দেখি Chrome 62-এ ডেভেলপারদের জন্য নতুন কী আছে!
পরিবর্তনের সম্পূর্ণ তালিকা চান? Chromium সোর্স রিপোজিটরি পরিবর্তনের তালিকা দেখুন।
নেটওয়ার্ক গুণমান নির্দেশক
নেটওয়ার্ক ইনফরমেশন API কিছু সময়ের জন্য Chrome-এ উপলব্ধ, কিন্তু এটি শুধুমাত্র ব্যবহারকারীর সংযোগের ভিত্তিতে তাত্ত্বিক নেটওয়ার্ক গতি প্রদান করে। কল্পনা করুন যে আপনি ওয়াইফাই ব্যবহার করছেন, কিন্তু একটি সেলুলার হটস্পটের সাথে সংযুক্ত যেখানে শুধুমাত্র 2G গতি আছে? এপিআই ওয়াইফাই রিপোর্ট করবে!
console.log(navigator.connection.type);
> wifi
ক্রোম 62-এ, ক্লায়েন্ট থেকে প্রকৃত নেটওয়ার্ক পারফরম্যান্স মেট্রিক্স প্রদানের জন্য API প্রসারিত করা হয়েছে। এই নেটওয়ার্ক মানের সংকেতগুলি ব্যবহার করে, আপনি নেটওয়ার্কের সাথে বিষয়বস্তু তৈরি করতে পারেন৷ উদাহরণস্বরূপ, খুব ধীর সংযোগে, আপনি একটি হ্রাস সংস্করণ পরিবেশন করে পৃষ্ঠা লোড কর্মক্ষমতা উন্নত করতে পারেন৷
আপনার অ্যাপ্লিকেশান লজিককে সরল করার জন্য, API পরিমাপিত নেটওয়ার্ক কর্মক্ষমতা প্রদান করে যে এটি একটি সেলুলার সংযোগের সাথে কীভাবে তুলনা করবে। উদাহরণস্বরূপ, একটি সুপার ফাস্ট ফাইবার সংযোগের সাথে সংযুক্ত, API 4G রিপোর্ট করবে।
console.log(navigator.connection.effectiveType);
> 4G
এই সংকেতগুলি HTTP অনুরোধ শিরোনাম হিসাবেও উপলব্ধ হবে এবং ক্লায়েন্ট ইঙ্গিতগুলির মাধ্যমে সক্ষম হবে৷ নমুনা চেকআউট করুন এবং একটি গভীর ডাইভের জন্য স্পেকটি দেখুন।
ওপেন টাইপ ভেরিয়েবল ফন্ট
ঐতিহ্যগতভাবে, একটি ফন্টে একটি ফন্ট পরিবারের শুধুমাত্র একটি দৃষ্টান্ত থাকে, উদাহরণস্বরূপ একটি ওজন বা একটি প্রসারিত। আপনি যদি নিয়মিত, সাহসী এবং তির্যক চান, তাহলে আপনার পৃষ্ঠার ওজন বাড়িয়ে তিনটি পৃথক ফন্ট অন্তর্ভুক্ত করতে হবে।
একটি OpenType ভেরিয়েবল ফন্ট হল একাধিক পৃথক ফন্টের সমতুল্য যা একটি একক ফন্ট ফাইলের মধ্যে কম্প্যাক্টভাবে প্যাকেজ করা যেতে পারে। font-variation-settings সিএসএস প্রপার্টি সামঞ্জস্য করে, প্রসারিত, শৈলী, ওজন এবং আরও অনেক কিছু সহজেই সামঞ্জস্য করা যায়, যা অসীম সংখ্যক শৈলীগত বৈচিত্র প্রদান করে। এই তিনটি ফন্ট এখন একটি একক, কমপ্যাক্ট ফাইলে একত্রিত করা যেতে পারে।
.heading {
font-family: "Avenir Next Variable";
font-size: 48px;
font-variation-settings: 'wght' 700, 'wdth' 75;
}
.content {
font-family: "Avenir Next Variable";
font-size: 24px;
font-variation-settings: 'wght' 400;
}
OpenType ভেরিয়েবল ফন্ট আমাদের প্রতিক্রিয়াশীল টাইপোগ্রাফি তৈরি করতে এবং আমাদের পৃষ্ঠার ওজন কমাতে একটি শক্তিশালী নতুন টুল দেয়। আরও বিশদ বিবরণের জন্য জন হাডসনের দ্বারা পরিচিত ওপেন টাইপ ভেরিয়েবল ফন্টগুলি দেখুন।
DOM উপাদান থেকে মিডিয়া ক্যাপচার
আপনি এখন DOM এলিমেন্টস এপিআই থেকে মিডিয়া ক্যাপচার সহ অডিও এবং ভিডিওর মতো HTMLMediaElements থেকে সরাসরি MediaStream সামগ্রী লাইভ-ক্যাপচার করতে পারেন।
একটি এইচটিএমএল মিডিয়া উপাদানে captureStream() আহ্বান করার পরে, স্ট্রীম করা বিষয়বস্তু ম্যানিপুলেট করা, প্রক্রিয়া করা, দূর থেকে পাঠানো বা রেকর্ড করা যেতে পারে। আপনার নিজের ইকুয়ালাইজার বা ভোকোডার তৈরি করতে ওয়েব অডিও ব্যবহার করে কল্পনা করুন। অথবা WebRTC ব্যবহার করে কোনো দূরবর্তী সাইটে বিষয়বস্তু স্ট্রিম করুন। সম্ভাবনা প্রায় অন্তহীন.
কিছু HTTP পৃষ্ঠার জন্য নিরাপদ লেবেল নয়
যেমন আমরা আগেই ঘোষণা করেছি , Chrome 62 থেকে শুরু করে, যখন কোনো ব্যবহারকারী একটি HTTP পৃষ্ঠায় ডেটা প্রবেশ করে, Chrome ঠিকানা বারে একটি লেবেল দিয়ে পৃষ্ঠাটিকে "নিরাপদ নয়" হিসাবে চিহ্নিত করবে৷ এই লেবেলটি সমস্ত HTTP পৃষ্ঠাগুলির জন্য ছদ্মবেশী মোডেও দেখানো হবে৷
এবং আরো!
এইগুলি বিকাশকারীদের জন্য Chrome 62-এর কয়েকটি পরিবর্তন, অবশ্যই, আরও অনেক কিছু আছে।
- অর্থপ্রদানের অনুরোধ API এখন iOS-এর জন্য Chrome-এ উপলব্ধ৷
- আপনি WebVR অরিজিন ট্রায়াল দিয়ে পরীক্ষামূলক সমৃদ্ধ VR অভিজ্ঞতা তৈরি করা শুরু করতে পারেন।
তারপর আমাদের YouTube চ্যানেলে সাবস্ক্রাইব করুন , এবং যখনই আমরা একটি নতুন ভিডিও লঞ্চ করব আপনি একটি ইমেল বিজ্ঞপ্তি পাবেন৷
আমি পিট লেপেজ, এবং Chrome 63 রিলিজ হওয়ার সাথে সাথে, আমি আপনাকে বলতে এখানে থাকব -- Chrome-এ নতুন কি!
,
- Chrome 62 তাত্ত্বিক ফলাফলের পরিবর্তে প্রকৃত কর্মক্ষমতা মেট্রিক্স প্রদান করে নেটওয়ার্ক তথ্য API কে আরও উপযোগী করে তোলে।
- OpenType ভেরিয়েবল ফন্টের জন্য সমর্থন এসেছে।
- আপনি HTML মিডিয়া উপাদান থেকে মিডিয়া স্ট্রিম ক্যাপচার করতে পারেন.
- আমি একটি গুরুত্বপূর্ণ পরিবর্তন সম্পর্কে একটি বিশেষ অনুস্মারক পেয়েছি যা Chrome 62-এ অবতরণ করছে৷
এবং আরো অনেক আছে!
আমি পিট লেপেজ । চলুন ডুব দিয়ে দেখি Chrome 62-এ ডেভেলপারদের জন্য নতুন কী আছে!
পরিবর্তনের সম্পূর্ণ তালিকা চান? Chromium সোর্স রিপোজিটরি পরিবর্তনের তালিকা দেখুন।
নেটওয়ার্ক গুণমান নির্দেশক
নেটওয়ার্ক ইনফরমেশন API কিছু সময়ের জন্য Chrome-এ উপলব্ধ, কিন্তু এটি শুধুমাত্র ব্যবহারকারীর সংযোগের ভিত্তিতে তাত্ত্বিক নেটওয়ার্ক গতি প্রদান করে। কল্পনা করুন যে আপনি ওয়াইফাই ব্যবহার করছেন, কিন্তু একটি সেলুলার হটস্পটের সাথে সংযুক্ত যেখানে শুধুমাত্র 2G গতি আছে? এপিআই ওয়াইফাই রিপোর্ট করবে!
console.log(navigator.connection.type);
> wifi
ক্রোম 62-এ, ক্লায়েন্ট থেকে প্রকৃত নেটওয়ার্ক পারফরম্যান্স মেট্রিক্স প্রদানের জন্য API প্রসারিত করা হয়েছে। এই নেটওয়ার্ক মানের সংকেতগুলি ব্যবহার করে, আপনি নেটওয়ার্কের সাথে বিষয়বস্তু তৈরি করতে পারেন৷ উদাহরণস্বরূপ, খুব ধীর সংযোগে, আপনি একটি হ্রাস সংস্করণ পরিবেশন করে পৃষ্ঠা লোড কর্মক্ষমতা উন্নত করতে পারেন৷
আপনার অ্যাপ্লিকেশান লজিককে সরল করার জন্য, API পরিমাপিত নেটওয়ার্ক কর্মক্ষমতা প্রদান করে যে এটি একটি সেলুলার সংযোগের সাথে কীভাবে তুলনা করবে। উদাহরণস্বরূপ, একটি সুপার ফাস্ট ফাইবার সংযোগের সাথে সংযুক্ত, API 4G রিপোর্ট করবে।
console.log(navigator.connection.effectiveType);
> 4G
এই সংকেতগুলি HTTP অনুরোধ শিরোনাম হিসাবেও উপলব্ধ হবে এবং ক্লায়েন্ট ইঙ্গিতগুলির মাধ্যমে সক্ষম হবে৷ নমুনা চেকআউট করুন এবং একটি গভীর ডাইভের জন্য স্পেকটি দেখুন।
ওপেন টাইপ ভেরিয়েবল ফন্ট
ঐতিহ্যগতভাবে, একটি ফন্টে একটি ফন্ট পরিবারের শুধুমাত্র একটি দৃষ্টান্ত থাকে, উদাহরণস্বরূপ একটি ওজন বা একটি প্রসারিত। আপনি যদি নিয়মিত, সাহসী এবং তির্যক চান, তাহলে আপনার পৃষ্ঠার ওজন বাড়িয়ে তিনটি পৃথক ফন্ট অন্তর্ভুক্ত করতে হবে।
একটি OpenType ভেরিয়েবল ফন্ট হল একাধিক পৃথক ফন্টের সমতুল্য যা একটি একক ফন্ট ফাইলের মধ্যে কম্প্যাক্টভাবে প্যাকেজ করা যেতে পারে। font-variation-settings সিএসএস প্রপার্টি সামঞ্জস্য করে, প্রসারিত, শৈলী, ওজন এবং আরও অনেক কিছু সহজেই সামঞ্জস্য করা যায়, যা অসীম সংখ্যক শৈলীগত বৈচিত্র প্রদান করে। এই তিনটি ফন্ট এখন একটি একক, কমপ্যাক্ট ফাইলে একত্রিত করা যেতে পারে।
.heading {
font-family: "Avenir Next Variable";
font-size: 48px;
font-variation-settings: 'wght' 700, 'wdth' 75;
}
.content {
font-family: "Avenir Next Variable";
font-size: 24px;
font-variation-settings: 'wght' 400;
}
OpenType ভেরিয়েবল ফন্ট আমাদের প্রতিক্রিয়াশীল টাইপোগ্রাফি তৈরি করতে এবং আমাদের পৃষ্ঠার ওজন কমাতে একটি শক্তিশালী নতুন টুল দেয়। আরও বিশদ বিবরণের জন্য জন হাডসনের দ্বারা পরিচিত ওপেন টাইপ ভেরিয়েবল ফন্টগুলি দেখুন।
DOM উপাদান থেকে মিডিয়া ক্যাপচার
আপনি এখন DOM এলিমেন্টস এপিআই থেকে মিডিয়া ক্যাপচার সহ অডিও এবং ভিডিওর মতো HTMLMediaElements থেকে সরাসরি MediaStream সামগ্রী লাইভ-ক্যাপচার করতে পারেন।
একটি এইচটিএমএল মিডিয়া উপাদানে captureStream() আহ্বান করার পরে, স্ট্রীম করা বিষয়বস্তু ম্যানিপুলেট করা, প্রক্রিয়া করা, দূর থেকে পাঠানো বা রেকর্ড করা যেতে পারে। আপনার নিজের ইকুয়ালাইজার বা ভোকোডার তৈরি করতে ওয়েব অডিও ব্যবহার করে কল্পনা করুন। অথবা WebRTC ব্যবহার করে কোনো দূরবর্তী সাইটে বিষয়বস্তু স্ট্রিম করুন। সম্ভাবনা প্রায় অন্তহীন.
কিছু HTTP পৃষ্ঠার জন্য নিরাপদ লেবেল নয়
যেমন আমরা আগেই ঘোষণা করেছি , Chrome 62 থেকে শুরু করে, যখন কোনো ব্যবহারকারী একটি HTTP পৃষ্ঠায় ডেটা প্রবেশ করে, Chrome ঠিকানা বারে একটি লেবেল দিয়ে পৃষ্ঠাটিকে "নিরাপদ নয়" হিসাবে চিহ্নিত করবে৷ এই লেবেলটি সমস্ত HTTP পৃষ্ঠাগুলির জন্য ছদ্মবেশী মোডেও দেখানো হবে৷
এবং আরো!
এইগুলি বিকাশকারীদের জন্য Chrome 62-এর কয়েকটি পরিবর্তন, অবশ্যই, আরও অনেক কিছু আছে।
- অর্থপ্রদানের অনুরোধ API এখন iOS-এর জন্য Chrome-এ উপলব্ধ৷
- আপনি WebVR অরিজিন ট্রায়াল দিয়ে পরীক্ষামূলক সমৃদ্ধ VR অভিজ্ঞতা তৈরি করা শুরু করতে পারেন।
তারপর আমাদের YouTube চ্যানেলে সাবস্ক্রাইব করুন , এবং যখনই আমরা একটি নতুন ভিডিও লঞ্চ করব আপনি একটি ইমেল বিজ্ঞপ্তি পাবেন৷
আমি পিট লেপেজ, এবং Chrome 63 রিলিজ হওয়ার সাথে সাথে, আমি আপনাকে বলতে এখানে থাকব -- Chrome-এ নতুন কি!