Forwarded from Azimjon's Fikrlog
📚 Bugun mutolaa.com ofisida mehmon bo’ldik, 1.7 million kitob, 1298 audio kitob va 820,000 foydalanuvchiga ega - ular orasida men ham bor. Ajoyib jamoa, o’zgacha muhit.
📍 Kitoblar orasida kofe ichib, kod yozmoqchi bo’lsangiz:
maps.app.goo.gl/CwdkC3K5efRTGLg26
📍 Kitoblar orasida kofe ichib, kod yozmoqchi bo’lsangiz:
maps.app.goo.gl/CwdkC3K5efRTGLg26
👍15🔥3
Forwarded from GDG Tashkent (Khumoyun Inoyatov)
🔥 GDG Tashkent-dan uzoq tanaffusdan keyingi birinchi kuzgi Web Dev Meetup #3 ni kutib oling!
Kelayotgan shanba kuni yurtimiz va dunyoning top kompaniyalarida faoliyat yuritadigan web-dasturchilar bilan Web Dev Meetup o’tkazamiz.
💥 Spikerlar ichida:
- Ravshan Samandarov, Oxagile;
- Diyorbek Sadullaev, Pinterest;
- Doniyor Yusupov, Uzum Market;
- Umar Sadullaev, Unicon Soft;
Tadbir to’liq o’zbek tilida bo’ladi!
👀 Sana: 7-Sentabr, 2024
🕙 Vaqt: 14:00
📍 Joy: IT Park, Muminov 7/1
Ishtirok etish narxi: BEPUL.
🎟 Ro'yxatdan o'tish uchun havola:
https://gdg.community.dev/events/details/google-gdg-tashkent-presents-web-dev-meetup-3/
* Joylar soni chegaralanganligi tufayli "First come first serve" qoidalari amal qiladi. Joy sig’imi 180 kishi. Tadbir online translatsiya qilinadi.
@gdgtashkent
Kelayotgan shanba kuni yurtimiz va dunyoning top kompaniyalarida faoliyat yuritadigan web-dasturchilar bilan Web Dev Meetup o’tkazamiz.
💥 Spikerlar ichida:
- Ravshan Samandarov, Oxagile;
- Diyorbek Sadullaev, Pinterest;
- Doniyor Yusupov, Uzum Market;
- Umar Sadullaev, Unicon Soft;
Tadbir to’liq o’zbek tilida bo’ladi!
👀 Sana: 7-Sentabr, 2024
🕙 Vaqt: 14:00
📍 Joy: IT Park, Muminov 7/1
Ishtirok etish narxi: BEPUL.
🎟 Ro'yxatdan o'tish uchun havola:
https://gdg.community.dev/events/details/google-gdg-tashkent-presents-web-dev-meetup-3/
* Joylar soni chegaralanganligi tufayli "First come first serve" qoidalari amal qiladi. Joy sig’imi 180 kishi. Tadbir online translatsiya qilinadi.
@gdgtashkent
👍6🔥3
Forwarded from 42⚡️
⚡️Frontend dasturlashga kirish
@qirikki dan offlayn darslar:
- 12,14,16,18-sentabr kunlari, soat 10:00 dan 16:00 gacha bo'lib o'tadi.
👨🏫 Mentor:
Diyorbek Sadullaev, Pinterest kompaniyasida senior dasturchi.
‼️ Joylar soni chegaralangan: darslarga faqat birinchi 15 kishi taklif qilinadi.
👉 42.uz/course/frontend-dasturlashga-kirish
@qirikki dan offlayn darslar:
- 12,14,16,18-sentabr kunlari, soat 10:00 dan 16:00 gacha bo'lib o'tadi.
👨🏫 Mentor:
Diyorbek Sadullaev, Pinterest kompaniyasida senior dasturchi.
‼️ Joylar soni chegaralangan: darslarga faqat birinchi 15 kishi taklif qilinadi.
👉 42.uz/course/frontend-dasturlashga-kirish
🔥18👍7👏2🎉1
👍1
HTML-like Comments
JavaScript qiziq til-da! Men ham bugun bildimki, HTML dagi kommentlar JS da ham ishlar ekan.
Yuqoridagi kodda <!-- ifodasi aslida komment boshlanishi edi. Shuning uchun ataylab joy tashlamay yozgandim. Aybga buyurmaysiz, qizg'in baxs ko'rgim kelgandi 😬.
Javob: 0
Chunki: "0 <!-- a;" === "0 // a;"
Ya'ni 0 dan keyin kelgan qism kommentariyaga aylanadi.
Variantlarda ham to'g'ri javob yo'q edi. Uzr 😬️️
Aytgancha, bu nafaqat brauzerda, NodeJS da ham ishlaydi. Chunki HTML-like comments ECMAScript spec'larida bor.
https://262.ecma-international.org/#sec-html-like-comments
JavaScript qiziq til-da! Men ham bugun bildimki, HTML dagi kommentlar JS da ham ishlar ekan.
Yuqoridagi kodda <!-- ifodasi aslida komment boshlanishi edi. Shuning uchun ataylab joy tashlamay yozgandim. Aybga buyurmaysiz, qizg'in baxs ko'rgim kelgandi 😬.
Javob: 0
Chunki: "0 <!-- a;" === "0 // a;"
Ya'ni 0 dan keyin kelgan qism kommentariyaga aylanadi.
Variantlarda ham to'g'ri javob yo'q edi. Uzr 😬️️
Aytgancha, bu nafaqat brauzerda, NodeJS da ham ishlaydi. Chunki HTML-like comments ECMAScript spec'larida bor.
https://262.ecma-international.org/#sec-html-like-comments
👍12🔥1
HTML ping
Ko'pincha sahifadagi linklarga analitika uchun "event listener"lar qo'shiladi. Masalan, biror link bosilganda "link bosildi" degan hodisa analitika serveriga jo'natiladi.
Buning uchun shu paytgacha JavaScript ishlatib kelganman. Hozir bilib qoldimki, buni faqat HTMLning o'zida qilsa ham bo'lar ekan,
Lekin bu usuldan foydalanmasam kerak. Chunki ping attributi faqat <a> tegi uchun mavjud. Button va boshqa elementlar uchun ishlamaydi. Bundan tashqari Firefox bu atribut ishlashini cheklar ekan.
Qachon ishlatar edim? Balki kichik HTML sahifa uchun analitika qo'shganda. 🤷♂️
Ammo baribir analitika servislari kutubxonalari shunchaki sahifaga ularning kutubxonasini qo'shish bilan linklarni kuzatishni boshlashadi. Ortiqcha ishga o'rin yo'q.
To'liq MDNda
Ko'pincha sahifadagi linklarga analitika uchun "event listener"lar qo'shiladi. Masalan, biror link bosilganda "link bosildi" degan hodisa analitika serveriga jo'natiladi.
Buning uchun shu paytgacha JavaScript ishlatib kelganman. Hozir bilib qoldimki, buni faqat HTMLning o'zida qilsa ham bo'lar ekan,
ping atributi orqali:
<a
href="https://example.com"
ping="https://example-tracking.com"
>Example Link</a
>
Lekin bu usuldan foydalanmasam kerak. Chunki ping attributi faqat <a> tegi uchun mavjud. Button va boshqa elementlar uchun ishlamaydi. Bundan tashqari Firefox bu atribut ishlashini cheklar ekan.
Qachon ishlatar edim? Balki kichik HTML sahifa uchun analitika qo'shganda. 🤷♂️
Ammo baribir analitika servislari kutubxonalari shunchaki sahifaga ularning kutubxonasini qo'shish bilan linklarni kuzatishni boshlashadi. Ortiqcha ishga o'rin yo'q.
To'liq MDNda
MDN Web Docs
HTMLAnchorElement: ping property - Web APIs | MDN
The ping property of the HTMLAnchorElement interface is a space-separated list of URLs. When the link is followed, the browser will send POST requests with the body PING to the URLs.
👍18
Intervyu savoli
1. Yuqoridagi kod, ya'ni "setTimeout"ni 0 millisekunddan keyin chaqirish qanday holatlarda qo'l keladi?
2. Bu yerda "callback" aslida 0 millisekunddan keyin chaqiriladimi yoki ko'proq vaqt oladimi?
Savollarga javobni izlanib ko'rishingizni xohlardim.
Javoblaringizni izohlarda qoldiring 👇
setTimeout(callback, 0);
1. Yuqoridagi kod, ya'ni "setTimeout"ni 0 millisekunddan keyin chaqirish qanday holatlarda qo'l keladi?
2. Bu yerda "callback" aslida 0 millisekunddan keyin chaqiriladimi yoki ko'proq vaqt oladimi?
Savollarga javobni izlanib ko'rishingizni xohlardim.
Javoblaringizni izohlarda qoldiring 👇
👍2
Media is too big
VIEW IN TELEGRAM
Animatsiyalarni debug qilish
Chrome DevToolsda animatsiyalar uchun alohida debug tab bor. U yerda xuddi After Effects yoki shunga o'xshash dasturlardagidek, ammo soddaroq debugging interfeys mavjud.
Bu tabni ochish uchun DevToolsda:
1. Cmd+Shift+P ni bosing (Windowsda Control+Shift+P)
2. "Show Animations" deb qidiring va uni tanlang
Chrome DevToolsda animatsiyalar uchun alohida debug tab bor. U yerda xuddi After Effects yoki shunga o'xshash dasturlardagidek, ammo soddaroq debugging interfeys mavjud.
Bu tabni ochish uchun DevToolsda:
1. Cmd+Shift+P ni bosing (Windowsda Control+Shift+P)
2. "Show Animations" deb qidiring va uni tanlang
👍12👏3
Render sikli
Brauzerda asosiy ikkita sikl mavjud:
1. Event Loop (Hodisalar Sikli)
Bu JavaScript vazifalarini boshqarish uchun javob beradi. Jumladan:
1. kodni bajarish
2. hodisalarga javob berish
3. asinxron operatsiyalarni (setTimeout, Promise yoki AJAX kabi jarayonlar) boshqaradi.
2. Rendering (Paint) Cycle (Sahifa Renderi Sikli)
Hodisalar sikli vazifalarni qayta ishlagandan so'ng, brauzer rendering jarayonini amalga oshiradi:
1. CSS stillarni hisoblash
2. joylashuvni aniqlash
3. kompozitsiyalash ya’ni piksellarni ekranga chizish.
Bu ikki sikl mustaqil ravishda ishlaydi, lekin yaqindan o'zaro ta'sir qiladi.
Brauzerda asosiy ikkita sikl mavjud:
1. Event Loop (Hodisalar Sikli)
Bu JavaScript vazifalarini boshqarish uchun javob beradi. Jumladan:
1. kodni bajarish
2. hodisalarga javob berish
3. asinxron operatsiyalarni (setTimeout, Promise yoki AJAX kabi jarayonlar) boshqaradi.
2. Rendering (Paint) Cycle (Sahifa Renderi Sikli)
Hodisalar sikli vazifalarni qayta ishlagandan so'ng, brauzer rendering jarayonini amalga oshiradi:
1. CSS stillarni hisoblash
2. joylashuvni aniqlash
3. kompozitsiyalash ya’ni piksellarni ekranga chizish.
Bu ikki sikl mustaqil ravishda ishlaydi, lekin yaqindan o'zaro ta'sir qiladi.
requestAnimationFrame - vazifalarni render sikli bilan sinxronlash uchun ishlatiladi.setTimeout - hodisalar sikli bilan ishlaydi va unga yangi vazifa qo’shishda ishlatiladi.👍8🔥3