Web_programming

table vs flex https://benfrain.com/css-performance-test-flexbox-v-css-table-fight/ این مقایسه ها به تنهایی معیار خوبی برای تصمیم نهایی نیستند و پارامترهای مانند میزان پشتیبانی - جامعه هدف و... نیز در نتیجه گیری مهم هستند - هدف از انتشاراین پست رویکرد میتنی بر تست است

یک سایت روسی هست که خیلی از کتابها رو میشه توش پیدا کرد! هر چند که استفاده از این کتابها بدون پرداخت کار درستی نیست ولی واقعا با وجود عدم امکان پرداخت و دریافت راه دیگری نمی شناسم! خداوند خودش ما را به راه راست هدایت کند http://gen.lib.rus.ec/

فردا زمانی در تقویمی فارسی خواهیم داشت که همه اعداد به ترتیب خواهند بود :) ۹۸/۷/۶ ۵:۴۳:۲۱

مشکل بعدی خود این pollyfill هم از اندروید ۴.۳ به بعد رو support می کند https://cdn.polyfill.io/v3/supported-browsers/ 😂😂 اکنون مریدان جامعه بدرند امروزه طراحی یک برنامه خوب کار ساده ایی نیست اگر می گوید می رویم سراغ روشهای cross platformها که راحت باشیم یادمان باشد معمولا حجم برنامه تولید شده با آنها بیشتر است (زمان بارگذاری بیشتر) 😂😂😂

کاربرد: برخی از خصیصه های جدید در javascript در برخی browserها و یا برخی نسخه های خاص پشتیبانی نمی شوند مثلا در لینک زیر https://caniuse.com/#search=forEach می بینید که دستور forEach در کدام browserها پشتیبانی میشود. در چنین مواقعی اغلب یک pollyfill برای آن می نویسند به عبارت دیگر ‍‍‍

if (window.forEach != undefined){ // browser does not support
      window.forEach = ....
}‍‍‍
‍‍‍

یعنی یک تایع برای browser ای که support نمی کند می نویسم و آن خصیصه را اضافه می کنیم حال برخی می گویند این باعث افزایش کد و کاهش سرعت بارگذاری برای همه کاربران می شود خوب سایتی مانند pollyfill برای مت این امکان را فراهم می کند که یک درخواست به آن بفرستیم و اگر browser کاربر خصیصه مورد درخواست را پشتیبانی نمی کرد در پاسخ کد مناسب برای این منظور ارسال کند در غیر اینصورت یک پاسخ خالی ارسال می کند. بدین ترتیب باعث افزایش سرعت برنامه و همچنین پیشتبانی مورد انتظار از browserهای مختلف خواهیم رسید

همانطور که مشاهده میکنید بخشی از box ابی که در صفحه می اید متوجه میشویم. روشهای دیگری برای این کار وجود دارد که اغلب مشکل performance دارند

https://github.com/w3c/IntersectionObserver/tree/master/polyfill کاربرد: -Lazy-loading of images or other content as a page is scrolled. -Implementing "infinite scrolling" web sites, where more and more content is loaded and rendered as you scroll, so that the user doesn't have to flip through pages. -Reporting of visibility of advertisements in order to calculate ad revenues. -Deciding whether or not to perform tasks or animation processes based on whether or not the user will see the result. مثلا اگر بخواهید یک لیست داشته باشید که ۱۰ هزار سطر دارد در حالت نرمال شما ۱۰ هزار المان به DOM اضافه خواهید کرد(در بدترین حالت) اگر بخواهید فقط به تعداد محدودی که بروی صفحه جا می شود المان اضافه کنید و با جابجایی اسکرول درون لیست را بوجود بیاورید مانند recycleViewدر اندروید انگاه این api کاربرد دارد این را بر روی گوشی اندروید ۴.۱ با api 16 تست کردیم (با browser پیش فرض گوشی یعنی بدترین حالت ممکن) جواب داد بنابراین با استفاده از polyfill معرفی شده می توانید به راحتی از ان استفاده کنید

https://medium.com/jsdownunder/locking-body-scroll-for-all-devices-22def9615177 #Body_ scroll_ lock

نکته: دستور

console.log(a,b);

در محیط شبیه ساز اندروید فقط آرگومان اول را چاپ می کند 😅

به جای این کار از این روش زیر بهره بگیرید https://reactjs.org/docs/javascript-environment-requirements.html

چگونه در شبیه ساز برای browser اندروید console وب را مشاهده کنیم؟ در آدرس بار عبارت about:debug را بنویسید و enter کنید

همچنین عدد 0.2 را به 0.001٪ تغییر دهید https://browserl.ist/?q=>0.001%25%2C+++++++not+dead%2C+++++++not+op_mini+all

راه حل این است که در فایل index.html در پوشه public خط زیر را اضافه کنید و یا معادل کد را خودتان در برنامه بنویسید <script src="https://cdn.polyfill.io/v2/polyfill.min.js"></script> البته روش زیر بهتر است https://reactjs.org/docs/javascript-environment-requirements.html

اگر یک برنامه ساده با create reat app بنویسید همانطور که در تصویر می بینید در اندروید با api ۱۶ یعنی اندروید ۴.۰۱ سایت شما load نمیشود.

به نظر شما دستور مشخص شده در بالا چه معنی دارد؟ نظرتان را برای من ارسال کنید تا درباره آن گفتگو کنیم :)