Ще десь у травні відклав собі нотатку, щоб зробити пост про Activity API в React, але постійно відкладав. Тема загалом проста, але цікава, тому час.

У React є експериментальна фіча — компонент (якщо це ще так можна назвати, ну або API) під назвою Activity.

Якщо читати документацію, то може бути трохи складно, тому дам просте пояснення. Огорнувши елементи в Activity, у вас з’являється можливість рендерити компонент лише у virtual DOM із низьким пріоритетом.

Я додам відео, де це класно показано, та приклад звідти мені дуже сподобався. Там показано велику кількість анімованих інтерфейсів, які при одночасному рендері садять FPS. Якщо приховати лише в CSS, то все одно блокуватимуть основний потік, бо HTML треба рендерити. Якщо не рендерити взагалі — не вийде прорахувати state наперед. Тут якраз Activity посередині: рендерить тільки віртуально, не блокує потік і тримає активним state.

Цікава фіча, нечасте застосування, але точно буде корисною.

https://react.dev/reference/react/Activity

Раніше писав про LiveStore. Його автор, Johannes Schickling, схоже, став великим популяризатором бібліотеки Effect. А потім це підхопив лисий чєл (не той, що ви подумали), відомий своїми відосами про TypeScript — Matt Pocock.

Я б хотів більше написати про Effect, але поки слабо відстрілюю. Поки. У моєму арсеналі аж одна прочитана книга з функціонального програмування, та й автори Effect кажуть, що це не обов’язково знати, хоч патерни й узяті звідти.

От що точно потрібно розуміти — це генератори, ну ті, що функції. І під руку, на хвилі цього хайпу, потрапив код від Мета. Він там мігрує дещо у своєму відкритому проєкті на Effect — точно буде найс підглянути.

https://x.com/mattpocockuk/status/1936145776465391658

Більше того, схоже, Мет має бажання створити відеокурс по Effect, тож, враховуючи його попередні успішні курси й уміння гарно подавати інфу, я, напевне, і сам буду зацікавлений його купити.

А якщо я більше розберуся з Effect і буду готовий щось написати, то неодмінно це зроблю.

https://effect.website/

Вийшли результати опитування The State of Devs 2025
Думаю ви точно бачили інші їх опитування раніше, типу State of CSS і тд

https://2025.stateofdevs.com/ua-UA/

Я вже точно не пригадую, але вроді теж проходив опитування.
З приємного - хоч українів статистично менше (але і вибірка не дуже велика), по середній зарплаті в цьому опитуванні вище за свинособак. Та все ж досить низько в рейтингу. Мені здається реальна ситуація дещо краща, або принаймні була такою в 2022 році...

64% девів не мають дітей
56% мають профільну освіту
Найбільші проблеми це поганий менеджмент та вигорання (63% та 62%), але 70% не відчувають дискримінації
56% заявило що їх дохід виріс але всеодно найбільшими труднощами зазначили недостатню оплату (43%)

То ІТ в дупі чи ні?

З мого попереднього поста про Effect я вже трохи глибше заглибився в тему — виглядає не так складно. Переглянув кілька дуже довгих відео, щоб просто відчути смак підходу. Насправді цікаво: ком’юніті теж непогане і досить привітне, що, звісно, корисно.

З усього контенту вибрав одне відео, яке досить добре пояснює, як працює Effect і яка з нього загалом користь.

Після такої кількості контенту починаєш почуватися ідеалістом: усе так гарно розкладено по поличках, нагадує підхід якогось солідного університету.

Я досі граюся з LiveStore, тож Effect так чи інакше буде залучений — може, не скрізь, але точно для схем даних, тому цікаво продовжувати дослідження.

А ось саме відео:
https://www.youtube.com/watch?v=ibxUIL_-LlA

Я вже деякий час, періодично та з паузами, працюю над мобільним додатком, який контролюватиме фізичний пристрій. Ну там вмикати, вимикати і всяке різне. Пристрій теж розробляю сам, до речі, та пишу код на плюсах.

А от додаток роблю на React Native. Після паузи в кілька років побачив, наскільки суттєво покращилась екосистема й як багато може Expo. У мене там і BLE, і Wi-Fi, і mDNS, та ще інші сервіси — не просто якийсь туду-ліст.

Багато інформації є в документації, статтях і просто в гуглі. Але деколи трапляються цікаві проблеми, про які нечасто щось публікують. Мені друг колись скинув одну телеграм-групу українського комʼюніті по RN. Я там нечасто щось сам питаю — здебільшого знаходив відповіді в історії повідомлень. Але от із розмови дізнався, що в Expo-проєкті можна видаляти деякі файли нативної частини, і Expo потім їх відгенерує — я взагалі не очікував цього.

Коротше, я вирішив там поділитись своїм каналом, і щоб було чесно, поділюсь тут посиланням на них: @reactnativesquad

Щойно релізнули Vite 7. Ну як, декілька годин тому.

Нічого надзвичайного, але під капотом рух в сторону повної міграції на Rolldown. Черговий прогрів? Та напевне ні, бо Rolldown вже можна пробувати. Але, схоже, треба Node 22+.

Як мінімум спробую мігрувати сторібук коли вони синхронізуються з оновленням, то болюча точка бо він дуже великий.

https://vite.dev/blog/announcing-vite7.html

Сьогодні робив рев’ю для друга-дизайнера сайту, який він «навайбкодив». Ми ще поспілкувалися, і він скинув класні референси блогів розробників-дизайнерів.

Дуже сподобалася одна стаття: Good vs Great animations.

Я взагалі фанат гарно анімованого UI. Але часто це виглядає кострубато. Можливо, тут теж можна застосувати правило з accessibility: або робити одразу високої якості, або взагалі не робити. Бо «на пів шишечки» часто відчувається не дуже або навіть може ускладнювати роботу з інтерфейсом. Думаю, з анімаціями так само.

У цій статті наведено буквально кілька прикладів, як із хорошої анімації зробити чудову. Але найголовніше — це не записи, а живі приклади: можна поклацати й глянути в devtools, як воно зроблено. Дуже круто, як на мене.

https://emilkowal.ski/ui/good-vs-great-animations

Якщо попередній пост набере 10 реакцій - скину ще це портфоліо

Шановні, в Drizzle відкрилась вакансія!

Шукають людину для роботи над документацією, туторіалами і щось в цьому напрямку.

Ось сторінка: https://petal-echo-01d.notion.site/Learning-Loop-Engineer-Dev-Rel-Drizzle-Team-21d0e2b8170480258860fd6ad305329d

Пригадую, як на першому курсі, коли ми проходили вступ до комп’ютерної інженерії, один із викладачів пояснював тему дискретизації сигналу. Одне з правил, яке він розповів, звучало приблизно так: «частота дискретизації має бути щонайменше вдвічі більшою за частоту сигналу».

На жаль (а може й на щастя), часу курсу не вистачало, щоб дуже глибоко зрозуміти всі аспекти цієї теми, ну а ще й я не був найздібнішим студентом. Тим не менш, інколи мені це згадується. А недавно мені в рекомендаціях трапилося відео, де більш наочно пояснено, що ж це взагалі таке.

https://www.youtube.com/watch?v=eBHbCZo9QrM

Одразу поясню, чому я про це пишу. На мою думку, розуміння таких тем загалом не потрібне для веб-розробки. Але я також вірю, що хоча б поверхневе розуміння того, як працює комп’ютер загалом, є важливим і додає вам певного % конкурентоспроможності. Тому я інколи кидаю щось і про embedded, роботу з пам’яттю чи те, як працює операційна система.

Сигнали є всюди: звук, зображення, будь-які дані — все це передається у вигляді аналогових сигналів. Комп’ютери дискретні, тобто працюють із визначеним набором значень, ну типу 0 та 1. Сигнали ж аналогові. І щоб перетворити сигнал з аналогу на дискретний, використовують семплінг: з певною частотою «слухають» вхідний сигнал і перетворюють його амплітуду в точках семплінгу на якісь дискретні значення.

Але щоб отримати цілісні дані, нам потрібно вибрати частоту, з якою цей семплінг відбувається, — тобто частоту дискретизації. Це сама по собі складна тема, не думаю, що зміг би докладно пояснити, бо сам не маю глибоких знань. Але тут достатньо згадати правило, про яке я писав вище: частота дискретизації має бути принаймні вдвічі вищою за частоту сигналу.

Уявімо сигнал частотою X герц, синусоїду, наприклад. Щоб перетворити його на дискретні значення, нам недостатньо частоти дискретизації теж X герц, адже тоді ми втратимо половину вершин сигналу. Мінімум нам потрібно 2 X герц, щоб дискретні значення відображали всі вершини. При нижчих частотах семплінгу спостерігається спотворення (aliasing), коли сигнал набуває хибного вигляду й не відтворює справжню форму. Тож правило «вдвічі більшої частоти» дійсно гарантує, що ключові точки сигналу «ловляться» без втрат.

Це ще називається теоремою Віттекера — Найквіста — Котельникова — Шеннона. Пригадую з універу тільки прізвище Шеннона.

А знаєте, як його звали? Клод Шеннон (Claude Shannon). Вікіпедія спекулює, що це ім’я взяли для назви відомої LLM-моделі, але переконливих підтверджень я не знайшов

Пробую ще раз. Шукаю на виробництво бпла/літаків людину на посаду помічника конструктора. Треба вміти працювати в SolidWorks. Локація Київ, робота по місцю.

Посилання на вакансію https://skydefenders.com.ua/careers

Буду вдячний за контакти та поширення.

True?

Зараз досить рідко користуюся Figma — роботи повно. Але інколи можу там редагувати якісь pet-проєкти. Звернув увагу на дещо, можливо, це було й раніше, але я не помічав.

У Figma Desktop присутній haptic feedback на трекпаді. Не знаю, чи це підтримують інші платформи, але на MacBook — так.

Це точно про те, що деталі важливі як в анімаціях, так і в усьому іншому. Мені прям дуже сподобалось, що таке є, тому вирішив погуглити, які взагалі є доступні API, бо, наприклад, у React Native це легко реалізувати.

Очікувано, в браузері немає доступу до приватних API macOS. Тому це працює тільки в Figma Desktop, а в браузері — ні.

Під Electron і Tauri, схоже, є пакети. Мені було б цікаво спробувати Tauri, глянув для нього — коду всього три файли, ніби нічого магічного, просто через макроси підтягують API і викликають його, тобто Foreign Function Interface (FFI).

Якщо колись тестуватиму Tauri і не забуду, то додам до додатка.

Під Electron теж, до речі, є пакет, але він уже роками не оновлюється.

https://github.com/ItsEeleeya/tauri-plugin-macos-haptics

Сподіваюсь я не стану максимально лінивим з цим інструментом, бо виглядає цікаво. Мені його порадили в твіттері.

Speach to text з капєц красивим дизайном і підтримкою локальних моделей.
Тепер ви дійсно можете накричати на ЛЛМ якщо вона не фіксить вам баги....

https://www.youtube.com/watch?v=h3NA_-Bo0zE

https://superwhisper.com/

Мав у списку ідей написати про Opaque Types в TS. Але вирішив, що пора таки спробувати дещо інший формат — відео.

Буду радий прочитати ваші коментарі та зауваження. Сподіваюсь, тема проста для розуміння та водночас цікава!

https://www.youtube.com/watch?v=4y6PX5mvQaM

До речі, може хтось помітив цікаву деталь на відео

Пригадую, як у своїй першій компанії доводилось проходити різні “екзамени”, щоб отримати вищий рівень (ну і зарплату, само собою). Якогось цілком конкретного фреймворку для цього не було, тому це проходило більше у форматі звичайної розмови, нагадувало інтерв’ю в компанію, але з глибшими питаннями.

Так як я тоді не знав, до чого готуватись, то сам склав собі Trello-дошку з можливими темами по JS і загалом програмуванню. Та дошка потім пішла як спадщина по тімейтах.

Одна з таких тем називалась Hidden Classes. Насправді, крім таких співбесід, ніде більше не зустрічав цієї теми, але прикольно знати — дає краще уявлення про роботу JS і оптимізатора.

Ось коротко:

Так як в JS ми можемо динамічно створювати об’єкти, то це створює масу варіантів того, якої форми ці об’єкти набудуть (форма, тобто структура, назва полів та їх порядок). Але вже під час рантайму відбувається оптимізація і створюються ці Hidden Classes. На кожну форму об’єкта створюється прихований клас, який потім використовується двигуном, щоб швидше діставати значення.

Ось приклад, скопіював з LLM:

function Point(x, y) {
  this.x = x; // creates hidden class A
  this.y = y; // transitions to hidden class B
}

const p1 = new Point(1, 2); // uses class B
const p2 = new Point(3, 4); // reuses class B — fast

p2.z = 5; // creates a new hidden class — potential slowdown

Малоімовірно, що така оптимізація потрібна буде у відносно простих додатках. Але, наприклад, якби я працював у New Relic чи PostHog, Sentry, то, можливо, це б мало значення для великих об’ємів даних.

Ось цікава відповідь, щоб почитати: stackoverflow
А також стаття: v8.dev