Interop 2024 के साथ वेब और बेहतर हो रहा है

 (webkit.org)
2 पॉइंट द्वारा GN⁺ 2024-02-03 | 1 टिप्पणियां | WhatsApp पर शेयर करें
  • Interop 2024 एक संयुक्त प्रोजेक्ट है जो प्रमुख browser engine टीमों को एक ही वेब फीचर को अधिक सुसंगत तरीके से implement करने के लिए संरेखित करता है, और इस साल यह 17 फोकस क्षेत्रों और 3 investigation projects के साथ चल रहा है
  • interoperability में सुधार को Web Platform Tests जैसे automated tests से मापा जाता है, और WPT में 18 लाख से अधिक tests हैं जिनमें प्रमुख browsers में कुल मिलाकर 95% से अधिक पास होते हैं
  • Interop 2023 ने चयनित tests के लिए 3 प्रमुख browser engines की साझा pass rate को 48% से 95% तक बढ़ाया, और P3 color, Subgrid, Container Queries, :has(), Web Components, Media Queries 4 सपोर्ट को काफी हद तक align किया
  • इस साल 96 प्रस्तावों में से 16 चुने गए और 2023 के कुछ काम को आगे बढ़ाते हुए Accessibility, CSS Nesting, Custom Properties, IndexedDB, Layout, Popover, URL सहित 17 क्षेत्रों पर फोकस किया गया
  • Microsoft Edge को Interop dashboard में एक अलग कॉलम के रूप में जोड़ा गया है, जिससे browser-वार प्रगति की अधिक सीधे तुलना की जा सकती है

browser interoperability को संरेखित करने का तरीका

  • वेब को विभिन्न डिवाइसेज़ पर काम करने के लिए डिज़ाइन किया गया है ताकि अरबों लोग इसका उपयोग सहयोग, सीखने और जुड़ने के लिए कर सकें
  • अगर developers को सभी browsers और सभी users के लिए एक जैसा अनुभव देना है, तो वेब तकनीकों के browser implementations एक-दूसरे से मिलते-जुलते होने चाहिए
  • implementation consistency वेब standards process में बनाई जाती है, और नई वेब तकनीकों का व्यवहार विस्तृत technical documents में परिभाषित किया जाता है
  • browsers वेब standards का पालन करते हैं या नहीं, यह automated tests से जांचा जाता है
    • Web Platform Tests में 18 लाख से अधिक tests हैं
    • प्रमुख browsers में कुल मिलाकर 95% से अधिक WPT पास होते हैं

Interop 2023 ने क्या बदलाव किए

  • Interop 2023 की शुरुआत इस स्थिति से हुई थी कि जनवरी 2023 में चुने गए tests में से 48% तीनों प्रमुख browser engines में पास हो रहे थे
    • baseline browsers थे users को वितरित Chrome, desktop Linux पर Firefox, और macOS Monterey पर Safari
  • एक साल बाद pass rate बढ़कर 95% हो गया
    • baseline browsers थे Chrome Dev, desktop Linux पर Firefox Nightly, और macOS Ventura पर Safari Technology Preview
  • कई वेब फीचर्स के लिए browsers के बीच support बेहतर हुआ
    • P3 color को रिलीज़ शुरू होने के 7 साल बाद सभी browsers में पूरा support मिला
    • Form controls ने वेब के इतिहास में पहली बार vertical writing mode को support किया
    • CSS border-image अब अपने मूल इरादे के अनुसार काम करने लगा
    • Subgrid, Container Queries, :has(), Motion Path, CSS Math Functions, inert, @property सभी आधुनिक browsers में support किए गए
    • Offscreen Canvas, Modules in Web Workers, Import Maps, Import Assertions, JavaScript Modules जैसे Web API बेहतर हुए
    • Media Queries 4 की पूरी specification अब आसान syntax के साथ हर जगह support होती है
    • Web Components में adoptedStyleSheets, ElementInternals, Form-Associated Custom Elements, Shadow DOM और Custom Elements के default behavior में सुधार हुआ
    • अब :nth-child(), :nth-last-child(), :modal, :user-valid, :user-invalid जैसे CSS pseudo-classes के लिए browsers में सुसंगत support की उम्मीद की जा सकती है
    • Feature queries अब font feature detection को नया support देती हैं
    • Font Palettes ने color font support को मजबूत किया
    • CSS Masking, HTML Forms, Pointer and Mouse Events, Scrolling, Transforms, URL, WebCodecs, और web compatibility bug bundles में भी काफ़ी प्रगति हुई
  • Interop 2023 के 26 फोकस क्षेत्रों में से 20 सफलतापूर्वक पूरे हुए
  • 2024 में भी Custom Properties, Pointer and Mouse Events, URL, और Flexbox·Grid·Subgrid को मिलाकर बना Layout काम जारी रहेगा

Interop 2024 की संरचना

  • 2024 में 96 फोकस क्षेत्र प्रस्तावों की समीक्षा की गई और अंततः 16 चुने गए
  • कुछ नए प्रस्तावों को समूहित करने और 2023 के कुछ काम को आगे बढ़ाने के साथ, Interop 2024 में कुल 17 फोकस क्षेत्र हो गए
  • stable version browsers के आधार पर Interop 2024 का कुल स्कोर संयोग से फिर 48% से शुरू हुआ
  • इस साल से Interop dashboard में Microsoft Edge का अपना कॉलम जोड़ा गया है
    • फिलहाल यह कॉलम Windows 10 पर चलने वाले Edge और Edge Dev को दर्शाता है

2024 के प्रमुख फोकस क्षेत्र

  • Accessibility

    • Interop 2023 के Accessibility रिसर्च प्रोजेक्ट में Apple accessibility टीम ने WPT के लिए accessibility test infrastructure बनाया और 1,300 से अधिक accessibility tests लिखे
    • इन tests को Interop 2024 के फोकस क्षेत्र में शामिल किया गया है ताकि browsers की accessibility support बेहतर हो
    • ज़्यादातर नए accessibility tests WAI-ARIA को कवर करते हैं
    • खास तौर पर Roles Model और Accessible Name and Description Computation पर ध्यान है
    • ये assistive technology उपयोगकर्ताओं को elements के उद्देश्य और वे क्या कर सकते हैं, यह समझने के लिए एक consistent mechanism देते हैं
    • HTML Accessibility API Mappings specification से जुड़े tests भी शामिल हैं
    • यह HTML elements के default accessibility meaning और <label>, image alt text जैसी सुविधाओं के लिए browser behavior rules को परिभाषित करता है
    • display: contents accessibility tests भी नए तौर पर जोड़े गए हैं
    • यह CSS display mode Flexbox या Grid के लिए parent-child-grandchild संबंधों को समायोजित करते समय content के आसपास के boxes हटाने में उपयोगी है
    • शुरुआती implementation में box हटाने पर accessibility tree से भी content पूरी तरह गायब हो जाता था, जिससे assistive technology उपयोगकर्ताओं के लिए समस्या होती थी
    • browsers में ज़्यादातर समस्याएँ ठीक कर दी गई हैं, लेकिन हर स्थिति में यह पूरी तरह हल नहीं हुआ है

  • CSS Nesting

    • CSS Nesting को Interop 2024 में शामिल किया गया है ताकि implementation differences कम हों और developers इसे भरोसे के साथ इस्तेमाल कर सकें
    • CSS nesting feature 2023 में चारों प्रमुख browsers में जारी किया गया
    • Chrome, Edge, Safari ने इसे अप्रैल और मई में पहले जारी किया
    • Firefox ने इसे अगस्त में जारी किया
    • वेब standard मई और अगस्त के बीच थोड़ा बदला, जिससे यह शुरुआती requirement ढीली हुई कि सभी nested selectors किसी symbol से शुरू होने चाहिए
    • developers अब & article की जगह article लिख सकते हैं
    • सभी implementations update हो चुकी हैं, लेकिन CSS Working Group द्वारा Nesting के जटिल व्यवहार को व्यवस्थित किए जाने के दौरान interoperability में सुधार की गुंजाइश अभी भी है
    • Safari के ज़्यादातर test failures इस बात से जुड़े हैं कि nested CSS, Shadow DOM और :host के साथ कैसे interact करता है

  • Custom Properties

    • @property at-rule पिछले कुछ वर्षों में browsers में जारी होना शुरू हुआ है
    • Interop 2023 के Custom Properties क्षेत्र में सभी stable browsers की common test pass rate 4% से बढ़कर 7.6% हुई, और सभी preview browsers में 90.7% tests pass हुए
    • Firefox इस support को सबसे अंत में जोड़ने वाला browser है, और इस पर अभी Firefox Nightly में काम चल रहा है
    • काम पूरा न होने के कारण यह 2024 में भी फोकस क्षेत्र बना हुआ है
    • @property का उपयोग करके CSS custom properties के syntax, inheritance behavior और initial value को लगभग उसी तरह declare किया जा सकता है जैसे browser engine CSS properties को परिभाषित करता है
    • इससे gradients या transform के कुछ हिस्सों जैसी animations संभव हो जाती हैं, जो पहले CSS में संभव नहीं थीं

  • Declarative Shadow DOM

    • Declarative Shadow DOM एक declarative API है, जिससे JavaScript के बिना सिर्फ HTML से reusable widgets और components बनाए जा सकते हैं
    • Safari 16.4 मार्च 2023 से, और Chrome 90 अप्रैल 2021 से इसे support करते हैं
    • Firefox के पास Firefox Nightly में इसका implementation है
    • यह State of HTML 2023 सर्वे में सबसे ज़्यादा माँगे गए features में से एक था, और सभी browsers में interoperability सुनिश्चित करने के लिए इसे Interop 2024 में शामिल किया गया है

  • Font size adjust

    • font-size-adjust इस बात का उपयोगी उदाहरण है कि पुराने तकनीकी क्षेत्रों पर ध्यान देना कितना काम का हो सकता है
    • Firefox ने इसे पहली बार 2008 में implement किया था, लेकिन web designers और developers के बीच इसका लगभग न तो उपयोग हुआ और न ही चर्चा हुई
    • शुरुआती specification समय के साथ two-value syntax के जरिए अधिक भाषाओं को support करने लगी, और from-font value के साथ usability भी बेहतर हुई
    • WebKit टीम ने Safari 16.4 में इसका basic version implement किया और Safari 17.0 में updates जोड़े
    • Mozilla ने Firefox 118 में implementation update किया, और Safari व Firefox फिलहाल सभी tests में 100% pass कर रहे हैं
    • Chrome ने 2015 में experimental implementation शुरू किया था, लेकिन अब तक इसे जारी नहीं किया है
    • Font size adjust ऐसा तरीका देता है जिससे text string के भीतर कई fonts को एक जैसे visual size में दिखाया जा सके
    • उदाहरण के लिए 1.4rem text में x-height, cap height, ch width, ic width, ic height को align किया जा सकता है
    • code और सामान्य text को मिलाने या एक ही वाक्य में कई भाषाएँ मिलाने पर यह उपयोगी होता है

  • HTTPS URLs for WebSocket

    • WebSocket API की एक विशेषता यह है कि इसमें ws: और wss: जैसे non-HTTP(S) schemes का उपयोग करना पड़ता है
    • URL behavior लगभग HTTP(S) URL जैसा ही होने के कारण API का उपयोग असुविधाजनक लग सकता है
    • WebKit टीम ने web developer feedback के आधार पर API में HTTP(S) URLs का support जोड़ा और इसे Safari 17.0 में जारी किया
    • पहले location.protocol के अनुसार wss: या ws: में बदलने वाला code लिखना पड़ता था, लेकिन अब इसे new WebSocket(path) की तरह इस्तेमाल किया जा सकता है
    • इसे Interop 2024 में शामिल करने का लक्ष्य है ताकि दूसरे browsers भी इसे अपनाएँ

  • IndexedDB

    • IndexedDB एक API है जो object-oriented database के रूप में client side पर data store करता है
    • यह 2011 से browsers में जारी होना शुरू हुआ, और web standard लगातार विकसित होता रहा है
    • version 2 और version 3 दोनों को सभी प्रमुख browsers support करते हैं
    • version 2 पूरी तरह interoperable है, लेकिन version 3 में implementation quality को बराबर करने के लिए अतिरिक्त काम की ज़रूरत है

  • Layout

    • CSS Grid और Flexbox को 2021 के मूल Interop project में शामिल किया गया था
    • Subgrid को Interop 2023 में जोड़ा गया
    • तीनों layout तरीके अच्छी स्थिति में हैं, लेकिन अभी पूरी तरह परिपूर्ण नहीं हैं
    • 2024 में तीनों क्षेत्रों के tests को मिलाकर Layout नाम के एक फोकस क्षेत्र में रखा गया है
    • जटिल edge cases में interoperability बढ़ाने का काम जारी है
    • developers Flexbox, Grid और Subgrid तीनों पर भरोसा करके उनका उपयोग कर सकते हैं, और सभी browsers इनका मजबूत support देते हैं

  • Pointer and Mouse Events

    • Pointer events mouse, pen/stylus और एक या अधिक उँगलियों के touch जैसे pointing input devices को एक ही DOM event model में संभालते हैं
    • यह API 2012 से browsers में जारी होना शुरू हुई और 2019 तक सभी browsers में आ गई, लेकिन interoperability अस्थिर थी

  • Interop टीम ने 2022 में Pointer and Mouse Events जांच प्रोजेक्ट शुरू किया, ताकि सहमति को स्पष्ट किया जा सके और उसे दर्शाने वाले टेस्ट लिखे जा सकें

    • Interop 2023 में ये टेस्ट एक फोकस एरिया बने, और पास दर 34% से बढ़कर 81% हो गई
    • अभी भी कुछ काम बाकी है, इसलिए 2024 में भी यह फोकस एरिया बना रहेगा

  • Popover

    • HTML का popover attribute ब्राउज़र में बिल्ट-इन तरीका देता है, जिससे कोई element पेज की सबसे ऊपरी layer में दिखाई दे सके
    • पूरे वेब पेज को ढकने वाला overlay बनाते समय dialog element सबसे उपयुक्त है
    • जब आप किसी दूसरे element को popup message, user interface, या दिखने-गायब होने वाली content में बदलना चाहते हैं, तब popover framework उपलब्ध कराता है
    • popover सपोर्ट 2023 में Chrome 114 और Safari 17.0 में जारी हुआ
    • Firefox, Firefox Nightly में इस सपोर्ट पर काम कर रहा है

  • Relative Color Syntax

    • Relative Color Syntax, किसी दूसरे रंग को संदर्भ बनाकर CSS रंग परिभाषित करने का नया तरीका है
    • इससे किसी मौजूदा रंग को कुछ मात्रा में हल्का या गहरा किया जा सकता है, या color variable की saturation को समायोजित करके उसे दूसरे variable में assign किया जा सकता है
    • design system बनाते समय यह खास तौर पर बहुत शक्तिशाली हो सकता है
    • Safari 16.4 ने मार्च 2023 में सबसे पहले इसका सपोर्ट जारी किया
    • Chrome 119 और Edge 119 ने अक्टूबर और नवंबर 2023 में इसका सपोर्ट जारी किया
    • अभी तक किसी implementation में currentcolor को Relative Color Syntax के साथ इस्तेमाल करने का सपोर्ट नहीं है
    • Interop 2024 का Relative Color Syntax एरिया पूरे सपोर्ट की बजाय खास तौर पर currentcolor सपोर्ट और out-of-gamut behavior टेस्ट पर केंद्रित है
    • इसमें यह देखा जाता है कि P3 color को सपोर्ट न करने वाले display पर क्या होता है

  • requestVideoFrameCallback

    • <video> element वेब पर video जोड़ने के लिए शक्तिशाली सुविधा देता है
    • HTMLVideoElement JavaScript में video object को नियंत्रित करने के लिए properties और methods देता है
    • requestVideoFrameCallback() हर video frame के हिसाब से काम को कुशलता से करने देता है
      • video processing या analysis
      • canvas पर draw करना
      • audio source के साथ sync करना
    • Chrome 83 और Safari 15.4 से इसका सपोर्ट उपलब्ध है
    • Interop 2024 में शामिल होने से browser implementation को पूरा करने और निखारने में मदद मिलती है

  • Scrollbar Styling

    • Scrollbar Styling एरिया में scrollbar styling के लिए इस्तेमाल होने वाली दो CSS properties शामिल हैं
    • scrollbar-width तीन मान देता है: auto, thin, none
      • auto डिफ़ॉल्ट चौड़ाई है
      • thin अधिक पतला scrollbar देता है
      • none content scrolling को बनाए रखते हुए scrollbar को छिपा देता है
    • Firefox 64 ने दिसंबर 2018 में इसका सपोर्ट लागू किया था, और Chrome 121 तथा Edge 121 में भी यह अभी जारी हुआ है
    • scrollbar-gutter scrollbar की जगह पहले से आरक्षित रखता है, ताकि scrollbar हो या न हो, layout एक जैसा बना रहे
    • scrollbar-gutter: stable ब्राउज़र को निर्देश देता है कि scrollbar न होने पर भी जगह आरक्षित रखी जाए
    • जब scrollbar की जरूरत की स्थिति बदलती है, तब यह layout shift को रोक सकता है
    • Chrome 94, Edge 94, और Firefox 97 में यह 2021~2022 के दौरान जारी हुआ
    • इस फोकस एरिया को पूरा करने के लिए Safari को सबसे अधिक काम करना है
    • Chrome और Firefox पहले ही 100% टेस्ट पास कर चुके हैं
    • Safari ने 2009 में ::-webkit-scrollbar-* के 9 pseudo-elements के जरिए scrollbar styling सुविधा पहले दी थी, लेकिन यह तरीका आधिकारिक CSS web standard नहीं बना
    • CSS Working Group ने इससे कहीं अधिक सरल तरीका चुना

  • @starting-style and transition-behavior

    • यह एरिया animation control के लिए दो नई सुविधाओं पर केंद्रित है
    • दोनों सुविधाएँ सितंबर 2023 में Chrome 117 और Edge 177 में जारी हुईं
    • @starting-style किसी खास element के शुरुआती मान को परिभाषित करने देता है
    • इसकी जरूरत तब पड़ती है जब कोई element transition से गुजरने वाला हो
    • यह display:none में जाने या वहाँ से बाहर आने वाले transition का तरीका भी देता है
    • transition-behavior उन discrete animation-capable properties के व्यवहार को CSS transition तक बढ़ाता है, जिन्हें पहले केवल animation में इस्तेमाल किया जा सकता था
    • यह element को दिखाने या छिपाने के समय display property को transition करने का रास्ता खोलता है

  • Text Directionality

    • टेक्स्ट के प्रवाह की दिशा वेब typography में एक महत्वपूर्ण तत्व है
    • कुछ भाषाएँ बाएँ से दाएँ बहती हैं, और कुछ दाएँ से बाएँ
    • dir attribute HTML elements पर दिशा को left, right, auto के रूप में चिह्नित करने देता है
    • auto ब्राउज़र से कहता है कि वह पहले अक्षर को देखकर दिशा का अनुमान लगाए
    • directionality और shadow tree के बीच की interaction हाल तक ठीक से परिभाषित नहीं थी
    • इस समस्या को standard स्तर पर संबोधित किया गया, और Interop 2024 में शामिल करने से implementation alignment की पुष्टि होती है

  • text-wrap: balance

    • वेब डिज़ाइनर लंबे समय से बहुत छोटी या केवल एक शब्द वाली पंक्तियों को रोकने का तरीका चाहते थे
    • responsive web design और column width पर सीमित नियंत्रण के कारण यह समस्या और कठिन हो जाती है
    • text-wrap कई विकल्प देता है, जिनसे ब्राउज़र को बताया जा सकता है कि खास use case के लिए line break कैसे गिने जाएँ
    • text-wrap: balance शीर्षकों के लिए उपयुक्त समाधान है
    • यह कुछ पंक्तियों के टेक्स्ट को संतुलित रूप से व्यवस्थित करता है, ताकि हर पंक्ति में लगभग समान मात्रा में टेक्स्ट हो
    • यह Chrome 114 और Firefox 121 में जारी हुआ, और Safari Technology Preview में implement किया गया है
    • Interop 2024 में text-wrap-mode, text-wrap-style, white-space-collapse के behavior टेस्ट भी शामिल हैं
    • CSS Working Group ने हाल ही में इन longhand के आपसी interaction के तरीके को बदला है, इसलिए अलग-अलग browser में सपोर्ट अभी समान नहीं है

  • URL

    • URL वेब के सबसे बुनियादी तत्वों में से एक है, और URL के बिना वेब का अस्तित्व नहीं है
    • वेब के शुरुआती इतिहास में बनाई गई कई चीज़ों की तरह URL सपोर्ट भी अभी पूरी तरह interoperable नहीं है
    • WHATWG ने URL Living Standard तैयार किया है, जिसमें विस्तार से बताया गया है कि URL को ठीक-ठीक कैसे काम करना चाहिए
    • इस standard को सपोर्ट करने वाले टेस्ट Interop 2023 के फोकस एरिया थे, और पास दर 77% से बढ़कर 85% हो गई
    • 2024 में भी interoperability सुनिश्चित करने के लिए काम जारी रहेगा
    • Safari ने टेस्ट के 99.7% पास किए हैं

अनुसंधान प्रोजेक्ट और प्रगति ट्रैकिंग

  • Interop 2024 में 3 अनुसंधान क्षेत्र भी शामिल हैं
    • Accessibility Testing
    • Mobile Testing
    • WebAssembly Testing
  • अनुसंधान क्षेत्र ऐसे कार्य हैं जिनमें Interop टीम अधिक टेस्ट लिखती है और उन्हें चलाने योग्य बनाती है
  • Mobile Testing अनुसंधान प्रोजेक्ट का लक्ष्य WPT के लिए आवश्यक इंफ्रास्ट्रक्चर को पूरा करना है ताकि मोबाइल ऑपरेटिंग सिस्टम पर ब्राउज़र का परीक्षण किया जा सके
    • भविष्य में Interop प्रोजेक्ट डैशबोर्ड में मोबाइल स्कोर भी शामिल हो सकता है
  • तीन अनुसंधानों में से दो पिछले साल से चल रहे प्रोजेक्ट हैं, लेकिन 2024 में ये सभी 0% पूर्ण स्थिति से शुरू हुए
  • भाग लेने वाली टीमों ने इस साल नए लक्ष्य तय किए हैं और डैशबोर्ड उन लक्ष्यों के मुकाबले प्रगति दिखाता है
  • Interop 2024 की प्रगति Interop 2024 dashboard पर देखी जा सकती है
  • इंटरऑपरेबिलिटी वेब की सफलता का एक बुनियादी स्तंभ है, और Interop 2022 तथा 2023 के काम के आधार पर 2024 में भी सहयोग जारी है

संबंधित पढ़ाई

1 टिप्पणियां

 
GN⁺ 2024-02-03
Hacker News की राय

  • यहाँ निश्चित रूप से कुछ शानदार बदलाव हैं, और बेहतर support मिलना अच्छी बात है
    उदाहरण के लिए CSS nesting एक बड़ा बदलाव है, क्योंकि यह SASS और LESS के उपयोगी होने की मुख्य वजहों में से एक था। variables जैसी preprocessor सुविधा होने के बजाय इसका CSS की core feature के रूप में आना वैसे भी ज़्यादा सही था
    custom properties से क्या किया जा सकता है, यह हमेशा दिलचस्प होता है, और Shadow DOM व custom elements के बाद अगला कदम अच्छा दिखता है। popover भी उम्मीद से बेहतर है, और अब JavaScript के बिना popup modal जैसी चीज़ें बना पाना बहुत उपयोगी है। इससे custom modal, dropdown menu, hamburger button आदि पर समय बर्बाद करना कम हो सकता है
    हालांकि ऐसे projects में forms पर भी और ध्यान दिया जाए तो अच्छा होगा। HTML 5 दौर के कई fields browser के हिसाब से बहुत अलग हैं, display के लिए proprietary pseudo-class styling पर निर्भर करते हैं, और कुल मिलाकर customize करना मुश्किल है—यह मौजूदा स्थिति ऐसे platform के लिए हैरान करने वाली हद तक पुरानी लगती है जिस पर लगभग कुछ भी किया जा सकता है

    • अगर UI designer को पूरी छूट मिले, तो वे अक्सर इन नए default modal·menu·button को नहीं चाहते, भले ही पुराने समय में उन्हें ये पसंद रहे हों
      यह बदलाव मददगार तो होगा, लेकिन UI में consistency को ऐसी feature की तरह नहीं, जिसे सभी को अपनाना चाहिए, बल्कि कमजोरी की तरह treat किया जाता लगता है
    • CSS nesting CSS preprocessor इस्तेमाल करने की आखिरी वजह है
      Safari 17.2+ के और व्यापक होते ही सीधे pure CSS इस्तेमाल किया जा सकेगा
      इसके अलावा @media queries के लिए variables भी एक वजह हैं, लेकिन इसकी जरूरत कम आम है

  • आखिरकार लगता है कि JPEG XL शामिल नहीं हुआ। यह देखते हुए कि यह बहुत लंबे समय बाद पहला image format है जिसने कुल मिलाकर स्पष्ट सुधार दिए, यह काफी समझ से परे है
    उम्मीद थी कि Interop उस स्थिति को रोकने में मदद करेगा जहाँ Google असल में adoption को रोक रहा है, लेकिन लगता है कि पुराने widely used formats के अधकचरे replacements जमा होते रहने के बीच हमें और इंतज़ार करना पड़ेगा

    • इस बात का मुझे भी अफसोस है
      समझ नहीं आता कि Google को JPEG XL से क्या दिक्कत है

  • “सभी browsers ने P3 colors को पूरी तरह support करना शुरू कर दिया है” कहना थोड़ा गलत है
    Firefox अभी भी colors को device पर भेजने से पहले सबको sRGB में clamp कर देता है। https://bugzilla.mozilla.org/show_bug.cgi?id=1626624#c16

  • मैं web पर बहुत कभी-कभार ही काम करता हूँ, इसलिए शायद मैं मुख्य target audience नहीं हूँ, लेकिन WebKit में सबसे ज्यादा खटकने वाली missing feature SVG favicon support की कमी है
    यह सच में समझना मुश्किल है, और अलग-अलग sizes वाले Apple-specific icons सब संभालना मेरे जैसे हल्के-फुल्के web developer के लिए काफी झंझट है

    • अब शायद आपको खुशी होगी कि हालात पहले जैसे नहीं रहे। अब सिर्फ एक Apple-specific icon काफी है [1]:
      [1]: https://evilmartians.com/chronicles/how-to-favicon-in-2021-s...
    • थोड़ा संबंधित बात है, लेकिन Chrome ico favicon होने पर SVG favicon इस्तेमाल नहीं करता। (https://bugs.chromium.org/p/chromium/issues/detail?id=145085...) इसलिए PNG favicon और SVG favicon दोनों साथ deploy करता हूँ
    • संदर्भ के लिए, Safari इस format के single-color SVG favicon को support करता है
      Vite जैसी चीज़ इस्तेमाल करें तो single source image से favicon और home screen icons की generation पूरी तरह automate भी की जा सकती है
    • SVG आपकी चाही हुई तरह scale नहीं होता। उदाहरण के लिए अगर आपने 256px square image को vector में बनाया हो, तब भी सिर्फ vector conversion से उसे 24px पर अच्छा दिखाना संभव नहीं है
    • सही बात है। इन सभी icons को generate करने की जरूरत होनी ही नहीं चाहिए
      और अच्छा होगा अगर lists को भी style किया जा सके। जैसे किसी element पर flag जैसी चीज़ लगाना
      CSS page transitions या scroll-driven animations का भी ज़िक्र नहीं है, जबकि ये भी boilerplate JavaScript घटा सकते हैं

  • इस लेख को पढ़कर उम्मीद से कहीं ज़्यादा उत्साहित हो गया
    सोच रहा हूँ कि भाग लेने वाले consortium में PWA focus area क्यों नहीं है

    • ऐतिहासिक तौर पर Interop का focus CSS पर ज़्यादा रहा है, लेकिन यह धीरे-धीरे बदल रहा है
      फिर भी कई test areas में worker tests शामिल हैं, इसलिए PWA की स्थिति भी बेहतर होनी है। 2023 में पूरा Modules section था, और PWA/worker-specific features की काफी testing हुई थी। OffscreenCanvas या mobile testing जैसे जिन APIs की testing/research हो रही है, उनमें से काफी कई PWA applications से गहराई से जुड़े हैं
      इस साल का Interop पिछले साल की तरह CSS-centricity में सबसे कम है। मेरी नज़र में इसमें IndexedDB, WebSocket और महत्वपूर्ण accessibility improvements वाले sections हैं, जिन पर PWA अक्सर निर्भर करते हैं। तीन research areas—WebAssembly, accessibility और mobile testing—भी सभी PWA से जुड़े हैं
      जानना चाहूँगा कि आप खास तौर पर किन APIs पर ज़्यादा focus चाहते हैं
    • जहाँ तक याद है, consortium में लगभग 12 लोग हैं, और ये लोग browser companies में भी काम करते हैं
      लक्ष्य यह है कि साथ बैठकर मौजूदा roadmap और workload को देखते हुए ऐसी features ढूँढी जाएँ जिन पर एक साल तक साथ काम किया जा सके या जिन्हें improve किया जा सके। Interop को मुख्य job के बड़े feature development के बीच निपटाए जा सकने वाले छोटे extra tickets जैसा समझ सकते हैं
      अब तक focus browser द्वारा content render करने के तरीके की बहुत low-level details पर रहा है। JavaScript APIs आम तौर पर standardize होकर “upstream” में merge हो चुकी होती हैं, इसलिए सुधार की सबसे ज़्यादा गुंजाइश इसी क्षेत्र में है
      सभी engines में नए features को एक साथ implement करने की दिशा में रुझान आने से पहले, browsers के बीच gaps भरने का काम और ज़्यादा होता रहेगा, ऐसा लगता है
      हालांकि Apple ने आखिरकार mobile Safari में web push जोड़ दिया है, जिससे PWA features का फायदा उठाने वाली ज्यादातर web apps को जिन चीज़ों की ज़रूरत होती है, उनके काफी करीब हम पहुँच गए हैं। जानना चाहूँगा कि अभी browsers में common रूप से उपलब्ध नहीं कौन-सी feature आप इस्तेमाल करना चाहेंगे
    • जानना चाहूँगा कि आपकी नज़र में PWA focus area में क्या-क्या शामिल होता है
      दूसरी जगह मैंने https://web.dev/learn/pwa/capabilities और https://whatpwacando.today link किए थे, लेकिन मुझे लगता है कि उन features में से काफी को मूल रूप से PWA features कहना मुश्किल है। बहुत सारी features PWA के बाहर भी व्यापक रूप से इस्तेमाल होती हैं, इसलिए उन्हें “PWA” bundle में डालने से अर्थ धुंधला हो जाता है। web developers के लिए “storage” या “media” जैसे bundles शायद ज़्यादा meaningful होंगे
      PWA की basic definition देखें तो यह मुख्य रूप से manifest और service worker, और इन्हें web platform के साथ combine करके इस्तेमाल करने के बारे में है
      manifest की automated testing मुश्किल है। इसकी content browser UI के अलग-अलग हिस्सों में दिखाई देती है, और UI आम तौर पर web standards में specify नहीं होती। वजह यह है कि vendors अपनी UI decisions लेने की स्वतंत्रता चाहते हैं। इसलिए इसे शामिल करना मुश्किल है, और interoperability issues कितने हैं यह भी स्पष्ट नहीं है
      service worker propose किया जा सकता है। पिछले कुछ वर्षों में propose नहीं हुआ, लेकिन मुझे नहीं लगता कि इस तरफ भी आजकल इतने ज़्यादा interoperability issues रहे हैं
    • PWA app store model को bypass करता है। browser से सीधे app install की जा सकती है
      इसलिए इस मुद्दे को खींचते रहना और PWA experience को जानबूझकर कम आकर्षक बनाना उनके हित में है
      Firefox ने PWA support क्यों हटाया, यह ठीक से नहीं पता, लेकिन शायद maintenance cost की वजह से हो सकता है
    • क्योंकि “content display” जैसे कहीं ज़्यादा व्यापक use case की तुलना में PWA एक niche use case है

  • Fonts
    CSS typography पर और ज़्यादा effort लगे तो अच्छा होगा
    खास तौर पर leading-trim और margin-trim की ज़रूरत है
    https://medium.com/microsoft-design/leading-trim-the-future-...
    https://developer.mozilla.org/en-US/docs/Web/CSS/margin-trim

  • सबसे बड़ी उपलब्धि यह होगी कि Safari updates operating system updates से बँधे न रहें

    • macOS पर यह संभव है
      लेकिन iOS पर नहीं
      और iOS updates हर 3–4 महीने में नए आते हैं, इसलिए व्यवहार में iOS पर यह समस्या नहीं है

  • सोच रहा हूँ कि क्या यह संकेत है कि WebKit WebAssembly features के साथ catch up करना शुरू कर रहा है
    फिलहाल यह Chrome और Firefox की तुलना में काफी पीछे है, और multiple memories या garbage collection जैसे बड़े और महत्वपूर्ण features नहीं हैं

    • दोनों अभी तक Wasm spec में शामिल नहीं हैं और standardization में हैं
      Google “Ready! Fire! Aim! Fire again!” के करीब है, इसलिए अधूरी specs की implementation को ज़्यादा आसानी से ship कर देता है, और Apple “Ready! Aim! Aim! Fire!” के करीब है, इसलिए आम तौर पर ऐसा करने से हिचकता है। Firefox के बारे में कहना मुश्किल है

  • विश्वास नहीं होता कि Cookie Store API अभी तक officially implement नहीं हुई है
    2024 में भी नाम से एक cookie लाने के लिए एक विशाल और messy string parse करनी पड़े, यह कैसे ठीक हो सकता है

    • शायद इसलिए कि HTML 5 localStorage आ गया था

  • WebSocket protocol issue मुझे अच्छी तरह समझ नहीं आता
    upgrade के बाद connection अब http(s) protocol नहीं रहता, तो यहाँ http या https इस्तेमाल करने की अनुमति देना भ्रामक नहीं है? ternary operator इस्तेमाल करना या current page के navigated value से अलग value होना क्या इतना भयानक है? browser normalization का काम होना अच्छा है, लेकिन यह item बदलने लायक हो तब भी इसकी priority काफी कम लगती है