761
Типы, фронтенд, DX и программирование в целом. Occasional music
Друзья!
На предстоящей HolyJS мы будем проводить игру по мотивам «Поля чудес». Но участники будут не только угадывать слово: ведущий также будет рассказывать истории из жизни разработчиков.
Так вот, нам нужны ваши истории — смешные, курьезные, да какие найдутся! Прислать их можно сюда.
Один нюанс: ваша история необязательно должна быть правдой 🙂 Задачей участников будет как раз отгадать, байка это или реальный случай. Так что можете и волю фантазии дать!
Вот еще вести с полей, в oculus browser есть нативная поддержка hls (такой формат для стриминга видео по http, поддерживается в safari и на мобильных платформах), но нельзя затащить видео текстуру на канвас: ругается на CORS, но он настроен правильно (на других платформах что поддерживают hls все чики пуки), и даже когда он не нужен такая же ошибка
Если кто знает куда им можно зарепортить буду благодарен
🎉 Релиз TypeScript 4.4 🎉
Вы можете подумать, а чего я тут фейерверки устраиваю? А потому что они таки улучшили то, с чем я уже довольно долго воюю. Надеюсь, они и дальше будут улучшать эти моменты. А какие именно, давайте обсудим в комментариях позже 🙂
Вчера команда TypeScript выпустила новую версию компилятора, в которой есть несколько интересных мест. Давайте подчеркнём самые интересные, по моему мнению:
- Улучшили Control Flow Analysis. Теперь, так называемые type guards, можно выносить в отдельные переменные и TypeScript не потеряет эту информацию по пути. Например, вы хотите проверить что что-то строка const isString = typeof someParam === 'string' и дальше вы можете писать просто if(isString) {}, TypeScript такое скушает (раньше это было ошибкой компиляции). И таких примеров побольше, можете почитать у них в посте.
- Все catch блоки по умолчанию приводятся к unknown типу (за флагом strict). Unknown тип это более безопасный вариант неизвестного типа, по сравнению с any. Я об этих типах, как раз, недавно писал. С этим релизом, TypeScript будет ошибки в catch блоках неявно приводить к unknown. И вам, собственно, нужно будет проверить что ошибка это та ошибка, которую вы ожидаете или нет.
- С этим релизом добавилась возможность иметь "inlay hints". Я с таким часто встречаюсь при разработке на Rust и, если честно, меня это немного бесит. Но, знаю людей, которым это очень даже заходит. Речь идёт о том, что в IDE у вас будут добавляться имена параметров к вашим аргументам или выведенный тип возврата функции будет добавлен как "inlay hint" возле вашей функции и так далее. Насколько я знаю, такое есть давно в Intelliji и им активно пользуются. А в этом релизе они добавили это на уровне компилятора.
Все остальные моменты, по моему мнению, не такие уж и большие, но, безусловно, интересные и для кого-то могут оказаться нововведением "вовремя". Вы можете почитать более подробно об изменениях в этой версии в их блог посте.
Сегодня в 19 по мск опять приду на ProConf (видеокаст где обозревают конференции), будем обсуждать Frontend Conf 2020
https://www.youtube.com/watch?v=Vh_WkUzno3k
В прошлый раз изучали Coq, в эту субботу в 17 по мск (да, через 15 минут, я не умею в анонсы) будем решать задачки на литкоде с @andreypopp
https://youtu.be/_GmnQTtKJqo
P.S. Если задачки не привлекают то знакомые c ufostation делают стрим в 17:30, будут писать сортируемый драг н дроп список на реакте
/channel/ufostation/637
В 15:00 (по Москве) собираемся сделать экспериментальный стрим с @andreypopp — решаем задачки на Coq из Software Foundations
https://softwarefoundations.cis.upenn.edu/
Я на юбилейном выпуске проконф https://www.youtube.com/watch?v=zYh4gkIaJ9E
Читать полностью…
Внезапно вещаю на proconf http://youtube.com/watch?v=X8sioTxbYJM&ab_channel=ProConf
Читать полностью…
У меня приняли ПР в тайпскрипт! https://github.com/microsoft/TypeScript/pull/43382
Читать полностью…
Совершенно потрясающая история о том почему алгоритмическая сложность — это важно
https://nee.lv/2021/02/28/How-I-cut-GTA-Online-loading-times-by-70/
Парсить 10мб жсона по 6 минут это надо уметь. Я ни виню здесь разрабов которые скорее всего кранчили это на 15-й чашке кофе с урывками на сон
А вот к Rockstar вопросы есть ибо воз и ныне там
Не представляю сколько CPU-часов было потрачено и сколько клавиатур сломано когда после этих 6 минут соединение падало
Я тут наткнулся недавно на очень интересную подборку задач по TypeScript. Особенность этих задач в том, что их нужно решать используя только систему типов TypeScript.
То есть, все задачки, которые там есть, их решение должно происходить в compile-time, никакого кода на TypeScript или JavaScript, кроме, собственно, типов.
И я призадумался. А не сделать ли мне «марафон» постов, где я буду идти по порядку от легкого уровня к сложному и рассказывать о решении, как оно работает, почему и так далее. Как вы на это смотрите? Не будет ли часто по одному посту в день на одну задачу из этой подборки?
Я лично уже прошел почти половину, очень интересно. Можно это всё завернуть в формат более продвинутого изучения типов. Не писать же только интерфейсы, правда? 🙃
В общем, я думаю это отличная идея и с завтрашнего дня, я буду выкладывать сюда решения задач и рассказывать почему решение работает (если, конечно, мы не придём к обратному решению в комментариях). А пока, вы можете поиграться и сами 😎
https://github.com/type-challenges/type-challenges
Хороший тред, много интересных идей в реплаях
https://twitter.com/sama/status/1337464959408754691
Вторая часть advent of code 2020 прямо очень интересная! Чтобы не спойлерить тем кто еще решает, я напишу решение в комменте
Но если не собираетесь решать, прошу под кат (ах, извините тут не хабр)
Многие недовольны тем что в 17 реакте нет новых фич, но для меня этот релиз очень важный, и вот почему
У нас на проекте есть оптимизация размера бандла — мы минифицируем всякое sed-ом (то что terser сам не умеет), но главным образом React.createElement. И всё бы ничего, но из-за того что это просто find-replace по сути, это ломает sourcemaps (а разбираться как бы их переправить для такого кейса не было ни времени ни сил). Но выкидывать минификацию не хотелось ибо разбрасываться килобайтами — к низким индикаторам производительности. В итоге была патовая ситуация
Речь конечно идет только про продакшен билд, но тут, как в анекдоте, нюанс — у нас одни и те же артефакты используются как на проде так и на стейджингах (чтобы быть максимально похожим на прод). Получалось что дебажить ни на проде (что тоже бывает полезно) ни на стейджингах нормально нельзя. Не смертельно, но очень неприятно
Но теперь jsx-runtime фактически сам делает эту оптимизацию и наша больше не нужна. Победа!
https://reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html
Пытливые могут ради интереса ознакомиться со спекой сормапов версии 3 (мне в свое время сильно помогла в понимании)
https://sourcemaps.info/spec.html
Я тут придумал очередную игру и если у вас есть клевые истории из айти (или неуемная фантазия), не поленитесь их рассказать (попиарим ваш твиттер в конце концов)
Читать полностью…
Давно сюда ничего не писал потому что на последние несколько месяцев активно погрузился в 3д разработку на js: threejs, react-three-fiber, webxr и иже с ними: я теперь возглавил разработку вебного VR интерфейса для нашего сервиса.
R3F, он же react-three-fiber это супер клевая идея, реакт рендерер который практически без оверхеда, засчет динамической природы js транслирует jsx (только с дргуими тэгами) в объекты three js (императивная библиотека для 3д в js)
выглядит примерно вот так
const Icon = ({ src, size }: { src?: string; size?: number }) => {
const [_, height] = useFlexSize();
const map = useTexture(src || Empty);
return (
<group>
{src && (
<group position={[0, -height / 2, 0]}>
<mesh>
<circleGeometry args={[26 / 400, 30]} />
<meshBasicMaterial color="#232529" />
</mesh>
<mesh position-z={0.001}>
<planeGeometry args={[size, size]} />
<meshBasicMaterial transparent map={map} />
</mesh>
</group>
)}
</group>
);
};
Очень крутая и интересная область с моей точки зрения, одно только 3д чего стоит, но есть еще один очень клевый челлендж:
выкатили ТС 4.4, про который я недавно писал /channel/typesafesound/34
Читать полностью…
Не могу сказать что удовлетворен стримом — кое как решили медиум, а хард и вовсе бросили под конец
Если вам было бы интересно что увидеть что-то конкретно, например стрим по реакту (как на @ufostation) или например по rescript — напишите в коментах
Еще вчера переустановил винду (переезжал на NVMe SSD) и решил попробовать winget в качестве пакетного менеджера (до этого пользовался chocolatey)
Он меня прям очень приятно порадовал, там были почти все пакеты что были нужны, свежих версий и тд
Ставить правда его сейчас не больно удобно — надо либо переключаться на Insiders Preview, либо просто инсталлер запускать из релизов гитхаба (но тогда обновления точно также придется ставить)
Но в остальном очень достойно, меня прям радуют девтулы микрософта — новый терминал, каскадиа код, power toys
https://github.com/microsoft/winget-cli
Недавно заглягнул в роадмапу тс и обнаружил совершенно пострясающую вещь которая уже в бете 4.4
https://devblogs.microsoft.com/typescript/announcing-typescript-4-4-beta/#cfa-aliased-conditions
Теперь информация о проверках который влияют на control flow (самое банальное — проверить на null), не теряются при выделении булевой переменной
То есть теперь можно писать
const notEmpty = x != null
if (notEmpty) {
x.toString()
}
Всякое с доклада про технический долг на secon
Офисная политика - https://podlodka.io/202
Переговоры - https://podlodka.io/166
Про кодмоды (англ) - https://youtu.be/PqeX2ElQOlQ
Несмотря на что кода там кот наплакал, у меня ушло часа 4 на то чтобы найти место где надо было что-то поменять
Вынес одну важную мысль:
Скорость с которой вы можете экспериментировать максимально критична для дебага кода, с которым вы еще не знакомы.
И важнее чем качество дебага как такого.
Дебаг как в IDE может прям реально помогать, но если от F5 до брейкпоинта проходит секунд 15, а увидеть что выведет console.log я могу за одну, я почти всегда выберу console.log
Залогирую то и сё, пойму что уже слишком далеко по стеку (данные уже неправильные) и просто запущу заново (с другими логами)
Вместо того чтобы гадать куда же поставить брейкпоинт, а потом проваливаться в имплементацию все глубже, потому что не хочется пропустить место где есть баг, а перезапускать долго
В IT, нанимаемость для компании часто путают с нанимаемостью для разработчика (тестера/дизайнера/etc.). Это особенно явно проявляется для не мейнстримных технологий.
Скажем вот ты фронт, любишь ФП и выразительные системы типов и хочешь писать на ReasonML (ReScript) или Elm
И ты думаешь : "А как работу то искать? Заходишь на ХХ и там один JS да TS.". Все одновременно так и не так: да, js/ts занимает львиную долю рынка, но рынок на самом деле ОГРОМНЫЙ.
И даже если какая-то технология имеет 1% или даже меньше, это все равно дофига компаний.
А еще стоит помнить что разрабы (и большинство других IT спецов) все еще в дефиците и это еще сильнее проявляется для немейнстрима: компаниям тяжелее нанимать разрабов на Ризоне потому что их мало на рынке!
И получается что для компании это риск (найм тяжелее), но для разраба не особо (помните прошлогоднюю историю про COBOL?).
Также мой собственный опыт показывает что компании которые используют нишевые технологии в среднем лучше по условиям чем типичное те что на стеке react-redux-ts
Лучше в плане, скажем, продукта, команды, задач, зп и т.д. Конечно не сразу во всем и не все до единой, но всё равно.
Так что смена технологии на более нишевую может дать более приятный опыт найма (чем искать серебренную иголку в стоге сена)
Но да, это субъективно
Вчера начал эксперименты по монорепе с композитными проектами. Взял на примере либы для презентаций (спасибо @molefrog за https://github.com/molefrog/presa), которую я когда-то форкнул и смигрировал на TS
Получилось в целом нормально, но столкнулся с несколькими проблемами
1. Если использовать config inheritance (как кстати советуют в документации) то parcel не видит jsx настройку из tsconfig (а это критично для react 17)
Полагаю что parcel в принципе не резолвит базовый конфиг
Кстати parcel 2 пока не поддерживает новые tsconfig.jsx настройки (react-jsx и react-jsxdev), а жаль, я хотел попробовать react-fast-refresh
2. Ошибки в vscode расходятся с результатами tsc build --watch и вообще отзывчивость ошибок в редакторе страдает — меняются только после сохранения.
Вероятней всего это из-за инкрементальных билдов (а они обязательны для композитных проектов), но я пока не понял нормально ли это, или это баг или я что-то не так настроил
Если сталкивались с подобным — напишите в коментах плиз
3. Я не нашел способа включить d.ts в эмит. Не генерацию тайпингов, а именно d.ts файлы которые расширяют существующие тайпинги
Например именно таким способом типизируется тема в styled-components
То есть либа для презентаций имеет готовую тему которую можно расширить, но как сделать так чтобы вместе с тайпингами для самой либы еще приехала глобальная d.ts про тему — непонятно
4. Фиксить ошибки вообще сложно ибо самые базовые будут сверху, а их надо фиксить в первую очередь (ведь они влияют на ошибки в зависимых проектах)
В итоге занимался увлекательным скроллингом
Итого - работает, и довольно прикольно! Следующий шаг будет интегрировать пакеты из этой монорепы в другую чтобы сделать аналог npm link
Давно не писал ибо деливерили огромный проект на работе, но вот наконец-то он в проде!
И TIL (today i learned, сегодня я узнал) что двойное подчеркивание это конвешн для тайпскриптовых тайпингов для scoped packages.
То есть тайпинги для babel-core будут @types/babel-core, а для @babel/core — @types/babel__core
Не самый крутой конвеншн, по моему мнению, но с поиском понятнее https://www.typescriptlang.org/dt/search?search=babel
П.С. На самом деле это было вчера
Давно присматривался к этому репо, но времени не было начать. И вот кто-то собрался решать
P.S. Это репост с другого канала, но я планирую как минимум отметиться там в коментах, а может что-то запостить и сюда
Иногда, казалось бы, простой PR порождает интересные предложения, дискуссии и выявляет подводные камни. Однажды после code and learn я решил добавить в issue template ноды повершельную команду чтобы достать нужную инфу об ОСи. Звучит просто, да?
И вот прошло чуть больше года и PR наконец-то смерджили! (три дня назад)
https://github.com/nodejs/node/pull/30289
Конечно большее время заняло ожидание (когда я внесу правки по ревью, само ревью, обуждение и т.д.). Но там ^ 35 сообщений, порой немаленьких и довольно содержательных.
К примеру cmd /c ver гораздо короче "$([Environment]::OSVersion | ForEach-Object VersionString) $(if ([Environment]::Is64BitOperatingSystem) { "x64" } else { "x86" })", но в нем нет битности системы
Или например было предложение сделать вот так systeminfo | findstr /B /C:"OS Name" /C:"OS Version" /C:"System Type". Не так коротко, но все еще лучше чем PowerShell-версия. Да вот только выяснилось что вывод systeminfo зависит от локали системы и findstr на не англоязычных виндах не найдет нужные строки
Ну и конечно всякие мысли от мейнтейнеров на тему того какого характера большинство багов с которыми они сталкиваются и насколько полезна та или иная информация (к примеру https://github.com/nodejs/node/pull/30289#issuecomment-650772698)
В итоге я даже рад что это заняло столько времени ибо я многое узнал 🙂 (и потратил кучу времени других людей)
Материалы по "Bending reality with type-directed emit"
Slides and materials for "Bending Reality with type-directed emit"
Слайды: https://bending-holyjs.netlify.app
Сама либа: https://github.com/ts-type-makeup/superstruct-ts-transformer…
Type visitor helper: https://github.com/ts-type-makeup/ts-type-visitor…
Про номинальные типы: https://youtu.be/m0uRxCCno00
Про работу с js AST: https://t.co/9ernl0RGpW?amp=1
Про бабель (англ): https://youtu.be/UeVq_U5obnE
И мы хайрим! https://hh.ru/vacancy/38324416