kirjs_ru
1.66K subscribers
327 photos
1 video
1 file
424 links
Стримлю про front-end, Open Source, Angular приходите ко мне на стрим :)

@kirjs | https://www.twitch.tv/kirjs
Download Telegram
На внезапном стриме начавшемся 5 минут назад сделаем генерацию и загрузку красивых (я надеюсь) превьюшек на ютуб.

📺 Посмотреть: twitch.tv/kirjs | youtu.be/pDjtNAnj-8A

🎤 Пообщаться голосом: kirjs.com/talk
На внезапном стриме начавшемся 5 минут назад Доделаем генерацию и загрузку красивых (я надеюсь) превьюшек на ютуб.

📺 Посмотреть: twitch.tv/kirjs | youtu.be/mTqU-vFEyi0

🎤 Пообщаться голосом: kirjs.com/talk
👍1🔥1
Вчера выкатили первый PR добавляющий signal inputs в Angular

https://github.com/angular/angular/pull/53521

🥕 Старые и новые инпуты можно будет мешать в одном компоненте (но не в сигнальных)
🥕 Внутрь можно будет передавать значения по умолчанию
🥕 Выглядит будто на основе этих примитивов можно будет создавать свои кастомные инпуты.

Пока это единственная причина, по которой я не использую сигналы
👍10👏2
Вчера организовал и поучаствовал в мощном сраче

Процесс организации я описал для чата отдельно, а технически разбор сделаем позже.

В целом
❤️ Оба участника пришли и дебаты состоялись, несмотря на скепсис
❤️ Пыл обоих участников
❤️ Интерес аудитории рос на протяжение дебатов
❤️Мурыч и Соер изо всех сил старались быть цивильными и не орать друг на друга, и это почти получалось.
❤️Николай сделал смешной анонс и картинку и оч помогал модерировать на стриме в нужные моменты, площадка экстрим цоде отлично подошла.
❤️ Я часто ржал на стриме потому что чат был очень смешной, чату респект.
😔 Никто из участников не шарил информацию со ссылкой на дебаты (а я и не просил), могло быть еще жарче.

Регламент и формат
❤️Я документировал все процессы переговоров и это пригодилось
😔Обсуждение регламента на стриме. Обсуждение регламента до стрима было стрессово и в какой-то момент мы просто остановились на компромиссном варианте и перестали копать вглубь. В результате это вылилось на стрим.

Контент
❤️ Мурыч принес интересные задачки
😔 Из-за формата дебатов и атмосферы конфликта не было возможности углубиться в изучение механики необходимой для понимания ответов.
😔 Мы разберем отдельно, но мне кажется вторая задачка была не очень корректно задана (про ключи)
❤️ Было душно в местах, но по ощущениям зрители восприняли это дело с некоторой долею юмора и понимания

Обсуждения
🤔У меня были два стрима с мурычем где я с трудом и не всегда мог помочь ему направить мысли в продутивное русло, я не знаю, почему я ожидал, что у меня это получится в ситуации с дебатами.
🤔Часто повторялась ситуация, где участники с пылом говорили вещи не противоречащие друг другу, но не слушали оппонента.
😔В нескольких моментах скатились на оскорбления и “ты ничего не знаешь”

Личное
🤣Господин промис
😔Стрим для меня проходил на 5 часав после моего времени сна и я был убитый, я так же не был дома на выходных.
❤️До стрима я сходил на концерт метала и зарядился атмосферой треша и угара.
🤔 Я не оч хорошо оседлал волну хайпа и конвертировал срач в миллион подписщиков (но я и не планировал)
🤔 Мой первый опыт со стримом на 2000 человек, пытался читать чат, порвал мозг

В целом было много эмоций, но и подумать было о чем, а это самое главное.

Огромное спасибо участникам, площадке и конечно всем чатам
👍15🔥63
В Понедельник (18 Декабря) в 19:00 по Москве к нам на стрим придет разработчик Taiga UI  @Waterplea.

На стриме Алекс покажет, как работают CSS Маски и расскажет, как они используются в Taiga UI.

📺 Посмотреть: twitch.tv/kirjs | youtu.be/vRlbb04qMfk
📚 Либа: taiga-ui.dev
🔥38
Ура! Разбор технической части стрима Мурыча и Соера!

Нам помогали @zede1697 и @koichi@kirjs_ru_chat)

В разборе мы посмотрели все вопросы и:
🟠 Оценили понятность вопросов и соответствие ожиданиям Мурыча
🟠 Спросили у Bard и ChatGTP и сравнили, насколько их ответы пересекаются с ответом, который ожидал Мурыч (чтобы понять, как поняли вопрос беспристрастные роботы)
🟠 Попытались проверить некоторые утверждения (присылайте, если мы что-то пропустили)
🟠 Попытались понять, что полезного можно извлечь из вопроса с технической стороны

Разбор оказался сильно длиннее, чем я планировал изначально,
В процессе мы собрали Google Doc на 25 страниц, где можно посмотреть, как мы пришли к таким выводам. Также записи обсуждения на 6 часов будут выложены в чате.

Если мы где-то накосячили, натупили, пропустили или опечатались, пишите в личку, или в чат.

𝌞 Оглавление:
Вопрос 1
Вопрос 2
Вопрос 3.1
Вопрос 3.2
Вопрос 3.3

🔻🔻🔻 Или просто скрольте дальше🔻🔻🔻
🔥10
Вопрос 1

Опишите в общих чертах, чем являются заявленные официальной спецификацией типы:

ECMAScript Language Types
ECMAScript Specification Types


Обозначьте, каким образом заявленные в ECMAScript Language Types типы определяют
особенности поведения языка JavaScript?

Сопроводите свой ответ примером с использованием таких типов как null и undefined.


Оценка понятности вопроса
🤖ChatGPT: 0%
🤖Bard: 0%,
🧑‍💻Наша субъективная оценка: Для нас не очевидна связь вопроса с конкретным пограничным случаем который Мурыч ожидал услышать
Также не очень понятно, зачем было спрошено про "ECMAScript Specification Types", т.к. дальше это не обсуждалось

Оценка ответа Соера на заданный вопрос
Соер Перечислил типы и объяснил семантическую разницу между null и undefined.

Можно было бы ответить глубже и добавить нюансов и интересных примеров, но в целом ответ норм

Факт чек (докапываемся по мелочам)
🤔 [неточность] Соер сказал что var и undefined и null это литерал
Соер имел в виду лексему, а Мурыч не заметил эту ошибку

🤔 [неточность] Соер сказал что function это тип, технически функция это объект с internal slot [[call]] https://tc39.es/ecma262/#sec-terms-and-definitions-function

🤷 [непонятка] Соер сказал, что значение undefined не потеряется, мурыч сказал что потеряется
Тут они оба правы, но говорят о разных вещах. Переменная перезапишется, но undefined можно получить с помощью void 0, или globalThis.undefined

🤔 [неточность] kirjs сказал, что "use strict" не даст перезаписать переменную undefined
"use strict" запрещает только перезапись свойство undefined в globalThis, а как переменную его все равно можно определить. Eslint поможет так не делать.

Что полезного мы узнаем в результате?

🐇
Null быстрее чем undefined, потому что что он литерал, а undefined это свойство лежащее в globalThis.
Вот статья о том как React переписал все на null

🐇
В спеке описано, что битовые операции работают только на 32х битовых числах, поэтому пример ниже вернет неправильное значение

2 ** 50 /*1125899906842624 */ | 0  // 0 


Рекоммендация книги
Книга с драконом пр
о компиляторы
Compilers: Principles, Techniques, and Tools - Alfred V. Aho, Monica S. Lam, Ravi Sethi, and Jeffrey D. Ullman
👍14🔥2
Вопрос 2

Что такое, согласно официальной спецификации, свойства для Object?

Существуют ли какие-либо существенные особенности в формировании свойств?

Если да то какие?


Оценка понятности вопроса
🤖ChatGPT: 10%
🤖Bard: 10%,
🧑‍💻Наша субъективная оценка: Вопрос был про свойства, а ответ ожидался про ключи, для нас это было неочевидно.

Оценка ответа соера на заданный вопрос
Соер сказал что свойство представлено объектом содержащим имя, значение + дескриптор. Что у объекта есть внутренние свойства ([[в квадратных скобках]]) и внешние.

В целом ответ по теме, но маловато, можно было бы развернуть и рассказать больше про дескрипторы, геттеры, сеттеры и пр.

https://tc39.es/ecma262/#sec-object-type
https://tc39.es/ecma262/#sec-property-attributes


Факт чек (докапываемся по мелочам)
🤔 [неточность] Соер сказал что в дескрипторе битовые поля, вероятно имел в виду булевы.

🤔 [непонятка] Мы не очень поняли, как Integer Index связан с BigInt и Atomics, которые Мурыч упомянул несколько раз?

🙀[косяк] Мурыч сказал: "В спецификации нету слова key ключ", поискал по слову "Key" и не нашел.
Если бы мурыч искал "key" (с маленькой буквы), или "property key", он бы его нашел
https://tc39.es/ecma262/#sec-object-type

🙀Мурыч так и не признал, что вопрос был про ключи.
Это как спросить про велосипед, а ожидать ответы о колесах


Что полезного мы узнаем в результате?
При слишком больших ключах, длина массива может остаться нулевой, что может привести к странным ошибкам.

var theArr = [];

theArr[ (2 ** 32 - 1 ) ] = 1;

theArr.length; // 0

theArr[ (2 ** 32 - 2 ) ] = 1;

theArr.length; // 4294967295

https://tc39.es/ecma262/#sec-array-exotic-objects-defineownproperty-p-desc
👍15🫡4
Вопрос 3

Каким образом организована обработка исключений exception в современном JavaScript

Как работает throw и try/catch

почему в если выбросить ошибку при создании промиса, она не ловится в try catch


Оценка понятности вопроса
🤖ChatGPT: 100%
🤖Bard: 100%,
🧑‍💻Наша субъективная оценка: Мы поняли вопрос

Оценка ответа Cоера на заданный вопрос
Соер сказал, что в блоке try вызывается throw и ловится в catch.
Это верный ответ, но можно было рассказать побольше.
Часть про Promise не была отвечена (но была обсуждена в следующем вопросе)

Факт чек (докапываемся по мелочам)

🤔 [косяк] Мурыч сказал, что "Throw это обычный Return (С особенностями)"

Это интересная аналогия, и у них есть общее свойство: они оба используют Completion Record на уровне спецификации.

При этом семантически и функционально они отличаются, мы пришли к тому, что они слишком разные, и это не очень точная или полезная аналогия
https://tc39.es/ecma262/#sec-completion-record-specification-type
👍20👨‍💻1🦄1
Вопрос 3.2

Почему код не будет срабатывать в catch

try {
setTimeout(() => { throw "Error"), 1)
} catch (e) {
console.log("Error: ", e);
}


или

try {
new Promise( (dores, doRej) => { throw "Ho"; } );
} catch (e) {
console.log("Error: ", e);
}


Оценка ответа Соера на заданный вопрос
Соер сказал, что код Promise выполнится вне try/catch.
На самом деле он выполняется синхронно внутри блока, но ловится Promise и перенаправляется в reject (Соер это позже поймет)

Оценка понятности вопроса
🤖ChatGPT: 100%
🤖Bard: 100%,
🧑‍💻Наша субъективная оценка: Мы поняли вопрос

Факт чек (докапываемся по мелочам)
Мурыч сказал, что callback переданный в Promise выполняется синхронно, так и есть

Что полезного мы узнаем в результате?
Если не распаковать Promise, exception не вылетит
👍19
🎉 разбора срача Соера и Мурыча - последний пост

Вопрос 3.3


Почему это ловится?

async function example() {
try {
await new Promise((resolve, reject) => {
throw "Ho";
});
} catch (e) {
console.log("Error: ", e);
}
};
example();


Оценка понятности вопроса
🤖 ChatGPT: 100%
🤖 Bard: 100%,
🧑‍💻 Наша субъективная оценка: Мы поняли вопрос

Оценка ответа Соера на заданный вопрос
Соер не понял вопрос и продолжил отвечать на предыдущий

Факт чек (докапываемся по мелочам)
🤔 Мурыч использовал этот пример в противовес ответу Соера, который сказал, что Promise обрабатывает ошибку.
Мы не очень поняли, почему это контрпример, в данном случае Promise ловит ошибку и отправляет в reject, а await при распаковке если видит reject перевыбрасывает ошибку
🔥27
Audio
Рекомендую ставить на репите, пока вы спите, и JavaScript мудрость впитается в ваш мозг.
🔥55😁135👍2
Появление React ребята из Facebook часто объясняют примерно вот так:

В далеком 2013 году в Facebook Chat часто появлялись фантомные сообщения: уведомление приходило, иконка загоралась, а самого сообщения не было.

Это было вызвано ужасным императивным кодом, а чтобы это починить и был придуман React.


У меня всегда были вопросы к этому объяснению. А вчера Adam Wolff причастный к разработке добавил деталей:

Да, React, был действительно создан для решения проблемы фантомных уведомлений, но эту проблему он в результате не решил, потому что проблема на самом деле была в кривых настройках DNS где-то в Индии, и когда DNS починили проблема ушла.

https://twitter.com/dmwlff/status/1762885255030259854?s=20
😁86🗿12🔥63👍1
На ng-conf объявили, что будут объединять Angular и wiz (внутре-гугловый фреймворк), посмотрим на днях на стриме что это значит.

https://twitter.com/sarah_edo/status/1770478763253379488?s=46&t=k9l-HypAj6tWJpDQhKBKCw

https://www.youtube.com/watch?v=nIBseTi6RVk&t=1s
👍9🥱6🔥3🌚3🤡1
В предверии нового релиза, завтра (в Пятницу, 19 Апреля) в 19:00 по Москве к нам на стрим придет Минко Гечев из команды Angular.

На стриме мы обсудим куда движется Angular и дальнейший планы. Приходите и задавайте свои вопросы.

⚠️ Стрим будет на английском

📺 Посмотреть: twitch.tv/kirjs | youtu.be/ZryO1zl4TEM
📚 angular.dev | twitter.com/mgechev
🔥445👍1
Минко на связи! приносите свои вопросы, у нас час
Можете спрашивать на русском, я переведу (или на Болгарском)
twitch.tv/kirjs | youtu.be/ZryO1zl4TEM
8
На внезапном стриме в 20:00 по мск Сделаем сайт с аккордами на фреймвоке analogjs.org

👀 Посмотреть: twitch.tv/kirjs | youtu.be/oRr_GCSQwMY

🗣 Пообщаться голосом: twitch.tv/kirjs
🔥92👍2
В Пятницу вечером в 20:00 с Виталием Павленко (@vitalypavlenko):

🎵 Посмотрим сайт rawl.rocks
🎵 Поболтаем о музыкальной теории
🎵 Обсудим код, интересные технические решения

📺 Посмотреть: twitch.tv/kirjs | youtu.be/zVuvWDFTpOc

🎶 rawl.rocks
👍54