फ्रंटेंड कॉन्फ 2018 के साथ छह सबसे उपयोगी रिपोर्ट

दोस्तों, कार्यक्रम समिति के प्रमुख के पद से, फ्रंटेंड कन्फ़ ने कटौती के तहत फ्रंटएंड पर RIT ++ 2018 की छह सबसे उपयोगी रिपोर्टों का संक्षिप्त अवलोकन रखा।

चयन में पीडब्ल्यूए अनुप्रयोगों को कॉन्फ़िगर करने और उन्हें अधिक मूल बनाने के बारे में एक कहानी के लिए एक जगह थी। अलग-अलग उठाए गए स्थानांतरण के मुद्दे हैं, जहां, उदाहरण के रूप में Yandex.Maps API का उपयोग करते हुए, यह दिखाया गया है कि आप ES2015 पर कैसे लिख सकते हैं, आउटपुट पर ES3 प्राप्त करते हैं, और IDE और लिंटर के लिए समर्थन प्रदान करते हैं। एक और कहानी लोकप्रिय छवि भंडारण स्वरूपों , उनके संपीड़न और मोबाइल उपकरणों पर डाउनलोड विकल्पों के बारे में है। सीपीयू से वीडियो कार्ड में एनीमेशन की गणना के साथ जुड़े लोड को कैसे स्थानांतरित किया जाए, इस पर कोई कम कट्टर रिपोर्ट नहीं। प्लस सीएसएस रहस्य और जीवन हैक के बारे में दो अलग-अलग रिपोर्ट।

सभी रिपोर्ट पूरी तरह से व्यावहारिक हैं, और कुछ पूरी तरह से समग्र हैं। एक शब्द में, वे ठीक वही हैं जिनसे हम प्यार करते हैं और फ्रंटेंड कॉन्फ मॉस्को के लिए चुने गए हैं।

कैसे एक वेब अनुप्रयोग को अधिक देशी और एक खुश उपयोगकर्ता बनाने के लिए

अपने स्वयं के प्रोजेक्ट को विकसित करने के अनुभव के आधार पर, KeepSolid उत्पाद कंपनी से टिमोफेई लाव्रेन्युक ने कहा कि क्या PWA का उपयोग करने से ऐसा एप्लिकेशन बनाना संभव है जो लगभग मूल जैसा व्यवहार करेगा।

टिमोफ़े ने अपने ग्राहक के तीसरे संस्करण में एक geek- उन्मुख समाचार एग्रीगेटर (GeekInformer) के लिए एक प्रगतिशील अनुप्रयोग की अवधारणा पर स्विच किया। वेब संस्करण की पृष्ठभूमि के खिलाफ, प्रगतिशील अनुप्रयोग ओएस के साथ अधिक एकीकरण के लिए सुविधाजनक हैं, विशेष रूप से, क्योंकि वे एंड्रॉइड के लिए अनुप्रयोगों की मानक सूची में उपलब्ध हैं। मूल अनुप्रयोगों के समान, उपयोगकर्ता अनुमतियाँ प्रबंधित कर सकता है या PWA की स्थापना रद्द कर सकता है।

एक घंटे से भी कम समय में, स्पीकर यह बताता है कि पीडब्ल्यूए कैसे काम करता है, और फिर विवरण के लिए आगे बढ़ता है - उदाहरण के लिए, यह सुनिश्चित करने के लिए कि एप्लिकेशन इंटरनेट की अनुपस्थिति में काम कर रहा है, सर्वर से डेटा का कैशिंग सेट करना, आदि।



उल्लिखित सुविधाओं के लिए, स्पीकर आवेदन में उनके एकीकरण के समय का एक व्यक्तिपरक मूल्यांकन भी देता है:



रिपोर्ट दिलचस्प विवरण, टूल के लिंक (और "बैसाखी") के साथ-साथ लेखक के वास्तविक उत्साह से भरी हुई है। सारांशित करते हुए, स्पीकर का कहना है कि PWA में वेब पेज (HTML5) और देशी एप्लिकेशन दोनों के फायदे हैं। उन्हें उम्मीद है कि निकट भविष्य में पीडब्ल्यूए डेस्कटॉप पर दिखाई देगा (जबकि वे केवल क्रोमओएस में हैं), इसलिए प्रौद्योगिकी एक महान भविष्य की भविष्यवाणी करती है।

असीमित वाष्पोत्सर्जन विकल्प

अगली रिपोर्ट के लेखक एंड्रे रोन्को, Yandex.Maps API के डेवलपर हैं। स्पीकर ट्रांसप्लिकेशन का उपयोग करके अपने अनुभव के बारे में बात करता है। बाबेल को मुख्य ट्रांसपिलर के रूप में देखते हुए, वह स्पीकर के अनुसार खुद को देखता है, प्रक्रिया के "हुड के तहत": यह बताता है कि यह सब सिद्धांत में कैसे काम करता है और इसे विशिष्ट कार्यों पर कैसे लागू किया जा सकता है।



Yandex.Maps API को विकसित करने की प्रक्रिया में, वर्णित दृष्टिकोणों ने ES2015 पर लिखने, ES3 आउटपुट प्राप्त करने में मदद की, और IDEs और लिंटर के लिए समर्थन प्रदान किया।

वैसे, रिपोर्ट में उपयोगी साहित्य और दिलचस्प प्लगइन्स के लिंक शामिल हैं। ब्राउज़र लाइन में अपने हाथों से उन्हें सामान न करने के लिए, लेखक ने विशेष रूप से सार्वजनिक डोमेन में एक प्रस्तुति पोस्ट की, जहां सभी लिंक क्लिक करने योग्य हैं।

उपयोगकर्ता को चित्र दिखा रहा है: एक विस्तृत गाइड

सामान्य रूप से एप्लिकेशन से, विवरणों पर चलते हैं। सबसे पहले जिस चीज पर मैं ध्यान केंद्रित करना चाहता हूं, वह है मोबाइल डिवाइस पर अपलोड की गई तस्वीरें, जो निकिता डबको, सॉफ्टवेयर इंजीनियर, iTechArt Group में फ्रंट-एंड डेवलपर हैं। उनकी रिपोर्ट में लोकप्रिय छवि भंडारण प्रारूपों, उनके संपीड़न और उपकरणों पर डाउनलोड विकल्प का अवलोकन है।

रिपोर्ट का मुख्य विचार बहुत सरल रूप से तैयार किया जा सकता है: मोबाइल डिवाइस के प्रोसेसर और नेटवर्क ट्रैफ़िक के लोड को कम करने के लिए संपीड़न मापदंडों और विधियों, साथ ही डाउनलोड विकल्पों को भी आपके कार्य को ध्यान में रखते हुए चुना जाना चाहिए।

रिपोर्ट का बहुत रस विशेष मामलों और उनसे संबंधित बारीकियों में छिपा होता है - स्पीकर विभिन्न दृष्टिकोणों के पेशेवरों और विपक्षों के बारे में विस्तार से जांच करता है, उनके उपयोग के लिए मामलों का सुझाव देता है, ब्राउज़रों में किसी विशेष विकल्प के समर्थन पर आंकड़े प्रदान करता है, विशिष्ट कार्यों को करने के लिए जीवन हैक और उपकरण साझा करता है।

यह उल्लेखनीय है कि बातचीत में धीमी इंटरनेट वाले उपयोगकर्ताओं के अनुभव और विकलांग लोगों के लिए चित्रों की उपलब्धता पर चर्चा करने के लिए एक जगह थी।

पिक्सेल पथ

एक और हार्डकोर रिपोर्ट वीडियो कार्ड के छवि संसाधनों की गणना के बारे में एनीमेशन उत्साही यूरी अरत्युक (कोडराइवर) की कहानी है।

यूरी ने अपने भाषण की शुरुआत अपने काम के कुछ बहुत ही दिलचस्प उदाहरणों और एक समान रूप से प्रभावशाली सपने के साथ की - गर्म बोर्श की सतह पर वसा के धब्बों का एक एनीमेशन बनाने के लिए (अच्छी तरह से, उनमें से कितने ने उन्हें चम्मच या ब्रेड के टुकड़े के साथ प्लेट पर निकाल दिया?) लेकिन रिपोर्ट का सार उस बारे में नहीं है, बल्कि सीपीयू से वीडियो कार्ड में एनीमेशन की गणना से जुड़े लोड को कैसे स्थानांतरित करना है।

उन स्थितियों के बारे में लंबे स्पष्टीकरण के बजाय जिनमें यह आवश्यक हो सकता है, यहां रिपोर्ट के लेखक से एक कैरिकेचर है:



संदर्भ से वीडियो रिकॉर्डिंग, वास्तव में, एनीमेशन के संदर्भ में WebGL का एक व्यापक परिचय है; डोम से समानांतर पिक्सेल गणना के लिए अपने सिर का पुनर्निर्माण कैसे करें। परिचय समाप्त करने के बाद, वास्तविक समय में स्पीकर दिखाता है कि कैसे shaders से परिचित होना शुरू किया जाए, साथ ही साथ कोड की एक-दो पंक्तियों के साथ दिलचस्प प्रभाव पैदा करें।

और भी सीएसएस रहस्य

मिठाई के लिए, सीएसएस क्षमताओं पर दो रिपोर्ट। पहले ली स्टोरी द्वारा अंग्रेजी कहानी है, कई ओपन सोर्स प्रोजेक्ट्स के एक डेवलपर, एमआईटी CSAIL के एक शोधकर्ता और सीएसएस समूह से आने वाले विशेषज्ञ, लगभग 10 अल्पज्ञात सीएसएस विशेषताएं। वैसे, ले वेरू सीएसएस रहस्यों के लेखक भी हैं, जिसका रूसी में अनुवाद किया गया है, अन्य बातों के अलावा।

रिपोर्ट 2011-2013 में आवाज उठाई और सीएसएस रहस्यों को समर्पित प्रदर्शनों की अगली कड़ी है।





जैसा कि उन रिपोर्टों में, 10 "ट्रिक्स" यहां प्रस्तुत की गई हैं, केवल सीएसएस क्षमताओं (जावास्क्रिप्ट के बिना) पर आधारित हैं। सामग्री को बेहतर ढंग से समझने में आपकी मदद करने के लिए, यहाँ कुछ उदाहरण दिए गए हैं:





आख्यान ऑपरेटिंग सिद्धांतों और अगले "लाइफ हैक" के विवरण के विस्तृत विश्लेषण के साथ वास्तविक समय कोड लिखने पर आधारित है, उदाहरण के लिए, गणित, जो सम्मिश्रण मोड में गुणा और स्क्रीन मोड के पीछे है।

यह देखते हुए कि कुछ "ट्रिक्स" सीएसएस में नवाचारों के लिए केवल धन्यवाद संभव हैं, उनके लिए स्पीकर प्रमुख ब्राउज़रों द्वारा समर्थन पर आंकड़े प्रदान करता है। काश, आज की परियोजनाओं में सभी 10 चालों का उपयोग नहीं किया जा सकता है (कुछ स्थानों पर, समर्थन ने हमें निराश किया है), लेकिन स्थिति काफी आशाजनक है।

क्या सीएसएस प्रीप्रोसेसरों को बदलने के लिए तैयार है?

एक अन्य रिपोर्ट लीग सी / एचटीएमएल अकादमी से सर्गेई पोपोव की एक औसत परियोजना के प्रिज्म के माध्यम से अंतर्निहित सीएसएस सुविधाओं और प्रीप्रोसेसरों की तुलना है।

विषय की "पवित्रता" (जुनून की डिग्री दर्शकों से सवालों के चरण में स्पष्ट हो जाती है) के बावजूद, लेखक श्रोताओं को यथासंभव प्रीप्रोसेसरों को छोड़ने के लिए प्रोत्साहित करता है, कम से कम उस हिस्से में जहां सीएसएस पहले से ही अपना समाधान प्रदान करता है।

प्रीप्रोसेसरों के विकास के इतिहास से शुरू होकर, स्पीकर इस टूलकिट में छोड़े गए विभिन्न डिज़ाइनों की प्रासंगिकता का विश्लेषण करता है, CSS और PostCSS की क्षमताओं के साथ समानताएं खींचता है, CSS के लिए CSS की दुनिया में उत्तरार्द्ध की भूमिका के साथ जावास्क्रिप्ट के लिए बराबर है।

प्रदर्शन ट्रेलर के बजाय, हम निम्नलिखित अंतिम योजना प्रदान करते हैं:



खैर, यहाँ क्या दर्शाया गया है, इसकी व्याख्या के लिए, हम अनुशंसा करते हैं कि आप रिपोर्ट को देखें।

दोस्तों, हम आपको सूचित करने की जल्दी में हैं कि अगला फ्रंटेंड कॉन्फ 2018 मास्को सम्मेलन बहुत जल्द - 4 और 5 अक्टूबर को आयोजित किया जाएगा। कार्यक्रम में प्रस्तुत और स्वीकृत रिपोर्ट इस पृष्ठ पर पाई जा सकती है।

नवीनतम फ़्रंटेंड कन्फ़ से ये केवल छह रिपोर्ट हैं, और उनमें से 7 गुना अधिक थे। यदि आप पहले सब कुछ सीखना पसंद करते हैं, तो सम्मेलन के YouTube चैनल की सदस्यता लें, पिछले वर्षों के सभी वीडियो पहले ही वहां अपलोड किए जा चुके हैं और सामग्री 2018 में अपलोड की जाएगी।

यदि आप अतुल्यकालिक चैनलों के माध्यम से जानकारी प्राप्त करना पसंद करते हैं, तो आपके लिए एक मेलिंग सूची है। प्रयास वहाँ प्रकाशित होते हैं, दिलचस्प रिपोर्ट की घोषणाएँ, कुछ वीडियो के उद्घाटन के बारे में संदेश, बैठकें आदि।

सामान्य तौर पर - हमारे साथ रहें! :)