नए कोडेक, अपडेट किया गया डिज़ाइन, और सीएलआई के लिए सहायता!
Squoosh, इमेज कंप्रेस करने की सुविधा देने वाला एक ऐप्लिकेशन है. हमारी टीम ने इसे Chrome Dev Summit 2018 में बनाया और लॉन्च किया था. हमने इसे अलग-अलग इमेज कोडेक के साथ आसानी से प्रयोग करने और आधुनिक वेब की क्षमताओं को दिखाने के लिए बनाया है.
आज हम इस ऐप्लिकेशन का एक बड़ा अपडेट रिलीज़ कर रहे हैं. इसमें कोडेक के लिए ज़्यादा सहायता, नया डिज़ाइन, और Squoosh CLI नाम की कमांड लाइन पर Squoosh इस्तेमाल करने का एक नया तरीका) शामिल है.
नए कोडेक इस्तेमाल करने की सुविधा
अब हम आपके ब्राउज़र के साथ मूल रूप से समर्थित कोडेक के अलावा OXPNG, MozJPEG, WebP, और AVIF का समर्थन करते हैं. WebAssembly के इस्तेमाल की वजह से, एक नया कोडेक फिर से बन गया है. कोडेक एन्कोडर और डिकोडर को WebAssembly मॉड्यूल के तौर पर कंपाइल करके उपयोगकर्ता, नए कोडेक ऐक्सेस कर सकते हैं और उनके साथ प्रयोग कर सकते हैं. भले ही, उनका पसंदीदा ब्राउज़र उनके साथ काम न करता हो.
एक कमांड लाइन Squoosh लॉन्च किया जा रहा है!
साल 2018 में पहली बार लॉन्च होने के बाद से ही, लोगों का आम तौर पर अनुरोध यह था कि बिना यूज़र इंटरफ़ेस (यूआई) के प्रोग्राम के तौर पर Squoosh के साथ इंटरैक्ट किया जाए. हमें इस पाथ को लेकर थोड़ी परेशानी हुई, क्योंकि हमारा ऐप्लिकेशन कमांड-लाइन आधारित कोडेक टूल के ऊपर एक यूज़र इंटरफ़ेस (यूआई) था. हालांकि, हम कई टूल के बजाय, कोडेक के पूरे पैकेज के साथ इंटरैक्ट करने की इच्छा को समझते हैं. Squoosh सीएलआई बिलकुल यही काम करता है.
आप npm i @squoosh/cli चलाकर, Squoosh CLI के बीटा वर्शन को इंस्टॉल कर सकते हैं. इसके अलावा, इसे सीधे npx @squoosh/cli [parameters] का इस्तेमाल करके भी चलाया जा सकता है.
Squoosh सीएलआई, नोड में लिखा जाता है. इसमें उसी WebAssembly मॉड्यूल का इस्तेमाल किया जाता है जिसका इस्तेमाल पीडब्ल्यूए
किया जाता है. कर्मचारियों के बहुत ज़्यादा इस्तेमाल के ज़रिए, सभी इमेज साथ-साथ डिकोड की जाती हैं, प्रोसेस की जाती हैं, और कोड में बदली जाती हैं.
हम रोलअप टूल का इस्तेमाल करके हर चीज़ को एक JavaScript फ़ाइल में बंडल करते हैं, ताकि यह पक्का किया जा सके कि
npx से तुरंत और आसानी से इंस्टॉल किया जा सके. सीएलआई, ऑटो कंप्रेशन की सुविधा भी देता है. इसमें बटरौगली मेट्रिक का इस्तेमाल करके, इमेज की क्वालिटी को कम करने की कोशिश की जाती है. हालांकि, विज़ुअल की क्वालिटी को खराब किए बिना ऐसा किया जाता है.
Squoosh सीएलआई की मदद से, वेब ऐप्लिकेशन में इमेज को कई फ़ॉर्मैट में कंप्रेस करें. साथ ही, ब्राउज़र को सबसे सही वर्शन चुनने के लिए <picture> एलिमेंट का इस्तेमाल करें. हम Webpack, Rollup, और अन्य बिल्ड टूल के लिए भी प्लग इन बनाने की योजना बना रहे हैं, ताकि इमेज को कंप्रेस करने की सुविधा आपके बिल्ड प्रोसेस का अपने-आप हिस्सा बन सके.
Webpack से रोलअप टूल का इस्तेमाल करने की प्रोसेस में बदलाव बनाएं
Squoosh बनाने वाली उसी टीम ने इस साल टूलिंग रिपोर्ट के लिए टूल बनाने पर काफ़ी समय लगाया है और हमारी बिल्ड प्रोसेस को Webpack से रोलअप पर स्विच करने का फ़ैसला लिया है.
प्रोजेक्ट की शुरुआत Webpack के साथ की गई थी, क्योंकि हम इसे एक टीम के तौर पर इस्तेमाल करना चाहते थे. साल 2018 में, सिर्फ़ Webpack ही एक ऐसा टूल था जिससे हमें प्रोजेक्ट को अपनी ज़रूरत के हिसाब से सेट अप करने में मदद मिली. समय के साथ, हमने Rollup के आसान प्लग इन सिस्टम को पाया है कि ESM की आसान प्रोसेस के चलते यह इस प्रोजेक्ट के लिए एक स्वाभाविक पसंद बन गया है.
यूज़र इंटरफ़ेस (यूआई) का अपडेट किया गया डिज़ाइन
हमने ऐप्लिकेशन के यूज़र इंटरफ़ेस (यूआई) के डिज़ाइन को भी अपडेट किया है. इसमें blobs को विज़ुअल एलिमेंट के तौर पर दिखाया गया है. हम अपने कोड में मौजूद डेटा का इस्तेमाल
कैसे करते हैं, इस बारे में थोड़ी सी बात है. Squoosh इमेज डेटा को एक ब्लॉब की तरह पास करता है, इसलिए डिज़ाइन में कुछ ब्लॉब को शामिल करना स्वाभाविक लगा (क्या आप इसे पाना चाहते हैं?).
रंगों के इस्तेमाल को भी बेहतर बनाया गया, ताकि यह रंग किसी खास लहजे से ज़्यादा बेहतर हो. इसके अलावा, यह एक वेक्टर है जो इस सुविधा को अलग करता है. साथ ही, इससे यह पता चलता है कि कौनसी इमेज, विकल्प के हिसाब से सही है. कुल मिलाकर देखें, तो होम पेज थोड़ा ज़्यादा आकर्षक है और टूल भी ज़्यादा साफ़ और कम शब्दों में बताया गया है.
आगे क्या है ?
हम Squoosh पर काम करते रहने की योजना बना रहे हैं. नया इमेज फ़ॉर्मैट रिलीज़ होने पर, हम चाहते हैं कि हमारे उपयोगकर्ताओं के लिए ऐसी जगह हो जहां वे बिना किसी बोझ के कोडेक के साथ खेल सकें. हम Squoosh CLI के इस्तेमाल को बढ़ाना और वेब ऐप्लिकेशन की बिल्ड प्रोसेस में ज़्यादा सुविधाएं शामिल करने की भी उम्मीद करते हैं.
Squoosh हमेशा से ओपन सोर्स रहा है, लेकिन हमने कभी भी कम्यूनिटी को बढ़ाने पर ध्यान नहीं दिया. साल 2021 में, हम योगदान देने वाले लोगों की संख्या बढ़ाने और इस प्रोजेक्ट में शामिल होने की प्रोसेस को बेहतर बनाने की योजना बना रहे हैं.
क्या आपके पास Squoosh के लिए कोई आइडिया है? कृपया हमें समस्या को ट्रैक करने वाले टूल के बारे में बताएं. टीम सर्दियों की छुट्टियों में जाने वाली है, लेकिन हम वादा करते हैं कि नए साल में हम आपसे वापस मिलेंगे.