🚀 Вместе эти технологии формируют инфраструктуру для local-first приложений:
1️⃣ PWA (Progressive Web App)
Веб-приложения с пользовательским опытом, близким к нативному: офлайн-режим, установка, быстрое время загрузки. Решают проблемы плохой связи и медленной сети, сочетая преимущества веба и нативных приложений.
2️⃣ CRDT (Conflict-Free Replicated Data Types)
Структуры данных для автоматического разрешения конфликтов в распределённых системах. Решают проблемы синхронизации, параллельного редактирования и обеспечивают работу офлайн-приложений без потери или конфликтов данных.
3️⃣ CAS Containers (Compare-And-Swap)
Атомарный механизм одновременного доступа, который хранит записи базы данных с защитой через хеши или версии. Решает проблемы race conditions, конфликтов одновременных изменений, обеспечивает консистентность и оптимистичное управление параллельным доступом в распределённых БД.
4️⃣ IndexedDB (browser built-in database)
Встроенная в браузер база данных с API для транзакционного хранения структурированных данных на стороне клиента. Решает задачи офлайн-хранения, локальных запросов, кэширования и построения b-tree индексов.
5️⃣ OPFS (Origin Private File System)
Защищённая высокопроизводительная файловая система, доступная только веб-приложениям в рамках одного origin (источника). Решает задачи хранения крупных файлов и высокоскоростных файловых операций в вебе.
6️⃣ Blockchain (без майнинга)
Распределённый защищённый журнал записей для децентрализованной базы данных с неизменяемой историей. Решает задачи целостности и неизменности данных, прозрачности и доверия.
7️⃣ JavaScript Smart Contracts
Бизнес-логика, выполняемая на языке JavaScript в децентрализованных средах. Решает задачи автоматизации и доверия при изменении данных, автоматического подтверждения договорённостей и безопасного выполнения кода.
8️⃣ WebSocket
Протокол для двунаправленного обмена данными в реальном времени через одно TCP-соединение. Решает проблемы задержек и поддерживает интерактивные приложения, близкие к реальному времени.
9️⃣ WebRTC (Web Real-Time Communication)
Протокол для потоковой передачи мультимедиа и обмена данными напрямую между пользователями. Решает задачи прямого взаимодействия в реальном времени, низких задержек и децентрализации без промежуточных серверов.
🔟 Metaschema
Декларативный язык схем для моделирования, валидации и синхронизации данных. Решает проблемы несоответствия данных, эволюции и миграции схем, упрощает описание метаданных и работу со сложными структурами данных.
1️⃣ PWA (Progressive Web App)
Веб-приложения с пользовательским опытом, близким к нативному: офлайн-режим, установка, быстрое время загрузки. Решают проблемы плохой связи и медленной сети, сочетая преимущества веба и нативных приложений.
2️⃣ CRDT (Conflict-Free Replicated Data Types)
Структуры данных для автоматического разрешения конфликтов в распределённых системах. Решают проблемы синхронизации, параллельного редактирования и обеспечивают работу офлайн-приложений без потери или конфликтов данных.
3️⃣ CAS Containers (Compare-And-Swap)
Атомарный механизм одновременного доступа, который хранит записи базы данных с защитой через хеши или версии. Решает проблемы race conditions, конфликтов одновременных изменений, обеспечивает консистентность и оптимистичное управление параллельным доступом в распределённых БД.
4️⃣ IndexedDB (browser built-in database)
Встроенная в браузер база данных с API для транзакционного хранения структурированных данных на стороне клиента. Решает задачи офлайн-хранения, локальных запросов, кэширования и построения b-tree индексов.
5️⃣ OPFS (Origin Private File System)
Защищённая высокопроизводительная файловая система, доступная только веб-приложениям в рамках одного origin (источника). Решает задачи хранения крупных файлов и высокоскоростных файловых операций в вебе.
6️⃣ Blockchain (без майнинга)
Распределённый защищённый журнал записей для децентрализованной базы данных с неизменяемой историей. Решает задачи целостности и неизменности данных, прозрачности и доверия.
7️⃣ JavaScript Smart Contracts
Бизнес-логика, выполняемая на языке JavaScript в децентрализованных средах. Решает задачи автоматизации и доверия при изменении данных, автоматического подтверждения договорённостей и безопасного выполнения кода.
8️⃣ WebSocket
Протокол для двунаправленного обмена данными в реальном времени через одно TCP-соединение. Решает проблемы задержек и поддерживает интерактивные приложения, близкие к реальному времени.
9️⃣ WebRTC (Web Real-Time Communication)
Протокол для потоковой передачи мультимедиа и обмена данными напрямую между пользователями. Решает задачи прямого взаимодействия в реальном времени, низких задержек и децентрализации без промежуточных серверов.
🔟 Metaschema
Декларативный язык схем для моделирования, валидации и синхронизации данных. Решает проблемы несоответствия данных, эволюции и миграции схем, упрощает описание метаданных и работу со сложными структурами данных.
🔥34⚡5🤯4❤2🎉1
«AI приложение, которое использует вас, как ассистента»
🤣32🤯3🔥1😁1🎉1💯1
🧘🏻♂️ AI приложение для медитации: нажал кнопку и оно медитирует за вас
😁23🤣14🔥4💯2🎉1
У меня, кстати уже собран пример чата с автоматической синхронизацией состояния для сообщений и реакций, с таким техстеком: CRDT + PWA (service worker), websocket, Node.js server (сохранение на файловую систему) + OPFS (сохранение в браузере на файловую систему), мы его на курсах и в сообществе и с выпускниками курсов разбирали. Но вам я его не покажу пока, потому, что вы хитрожопые и все хотите взять и использовать без понимая, держите вот вторую часть лекции по CRDT https://youtu.be/7HVvvtQdkRg
YouTube
🔀 CRDT: множества G-set, 2P-set, LWW-set, OR-set, PN-set на JavaScript
👉 Code example: https://github.com/HowProgrammingWorks/CRDT
👉 Курс «Асинхронное программирование»: https://github.com/HowProgrammingWorks/Index/blob/master/Courses/Async-2025.md
👉 Курс Node.js: https://github.com/HowProgrammingWorks/Index/blob/master/Courses/NodeJS…
👉 Курс «Асинхронное программирование»: https://github.com/HowProgrammingWorks/Index/blob/master/Courses/Async-2025.md
👉 Курс Node.js: https://github.com/HowProgrammingWorks/Index/blob/master/Courses/NodeJS…
😁21⚡3❤2👍2🔥2🤯1
Тут пример приложения с автоматической синхронизацией состояния между закладками, сервером и несколькими устройствами по принципу local-first, объяснение подхода и того, как в нем применяются Service worker, CRDT, OPFS и другие части технологии
https://youtu.be/jHgprxfOgBY
https://youtu.be/jHgprxfOgBY
YouTube
🧑💻 Local-first приложение: PWA + CRDT + OPFS + Node.js + Websocket + Service Worker
👉 Community подписчики на Patreon получают все примеры кода из лекций, еженедельные стримы, семинары, лайвкод, Q&A сесси, дополнительные материалы, что я выпускникам готовлю. $10 в месяц: https://www.patreon.com/tshemsedinov/membership
👉 Курс «Асинхронное…
👉 Курс «Асинхронное…
❤10👍3🔥3🤣1
На прошлой неделе я потратил 2 часа, чтобы заставить AI написать генератор уникальных идентификаторов так же эффективно, как это сделал я за 18 минут. Без развернутого ТЗ генератор, написанный AI давал в 4-5 раз худшую производительность. Потом я погулял неделю и придумал как написать код, работающий еще в 2 раза эффективнее. Интересно, сколько времени теперь понадобится, чтобы сделать новое ТЗ, по которому такой результат будет достигнут AI. https://github.com/HowProgrammingWorks/CodeWithAI
👍25🤯5😁4
Программирование с Cursor / GPT-5
Вчера на созвоне я показал, как в 2 раза обставил GPT-5 по производительности кода и мы написали для него ТЗ, со всеми идеями, что я применил в своем варианте, чтобы Cursor мог их применить и что из этого получилось...
Участие в созвонах и их записи через подписку на Patreon: еженедельные стримы, семинары, лайвкод, Q&A сессии, лекции. $10 в месяц: https://www.patreon.com/tshemsedinov/membership
Вчера на созвоне я показал, как в 2 раза обставил GPT-5 по производительности кода и мы написали для него ТЗ, со всеми идеями, что я применил в своем варианте, чтобы Cursor мог их применить и что из этого получилось...
Участие в созвонах и их записи через подписку на Patreon: еженедельные стримы, семинары, лайвкод, Q&A сессии, лекции. $10 в месяц: https://www.patreon.com/tshemsedinov/membership
😁10🤣5👍3🤩1
Если хотите задать вопрос на стрим по Local-first / Offline-first в субботу, то тут форма. Вопросы принимаем только в форму https://forms.gle/C5iwiqw13GuYad2E8
Тут предварительный обзор темы https://t.me/HowProgrammingWorks/1871
Тут предварительный обзор темы https://t.me/HowProgrammingWorks/1871
🔥6👍4❤3
Суббота 15:00, Вопросы задавайте в форме, ссылка под видео
https://youtube.com/live/cSWOOVh7xkU
https://youtube.com/live/cSWOOVh7xkU
YouTube
📥 Local-first для фронтенда: CRDT, PWA, OPFS, Blockchain прямо в браузере
👉 Регистрация на мастер-класс по local-first: https://forms.gle/ENXGB84bRY4fCiYZ8
Темы: Офлайн, синхронизация, смарт-контракты на JavaScript, real-time без бэкенда
🚀 Вместе эти технологии формируют инфраструктуру для local-first приложений:
1️⃣ PWA (Progressive…
Темы: Офлайн, синхронизация, смарт-контракты на JavaScript, real-time без бэкенда
🚀 Вместе эти технологии формируют инфраструктуру для local-first приложений:
1️⃣ PWA (Progressive…
👍5❤4🔥1
Готовим вопросы на сегодняшний стрим:
- Робота в офлайне без потери данных
- Local-first и синхронизация
- Где крутилки? А их нет
- Использование AI для разработки
- Архитектура во фронтенде
- Blockchain во фронтенде
- Структура кода во фронтенде
- Паттерны во фронтенде
- PWA и Service Worker
- CRDT, op-based, delta, OT, CAS
- Миграции и распределенные транзакции
- Интерактивные приложения (приближенные к реальному времени)
https://forms.gle/C5iwiqw13GuYad2E8
- Робота в офлайне без потери данных
- Local-first и синхронизация
- Где крутилки? А их нет
- Использование AI для разработки
- Архитектура во фронтенде
- Blockchain во фронтенде
- Структура кода во фронтенде
- Паттерны во фронтенде
- PWA и Service Worker
- CRDT, op-based, delta, OT, CAS
- Миграции и распределенные транзакции
- Интерактивные приложения (приближенные к реальному времени)
https://forms.gle/C5iwiqw13GuYad2E8
Google Docs
📥 CRDT + PWA + State sync + Blockchain
Experts: Timur Shemsedinov, Illya Klymov
🔥8👍4❤2
Конкурс для получения 2 мест на один из моих курсов
1 место может выиграть любой человек, а второе только один из выпускников
https://github.com/tshemsedinov/code-with-ai-contest
1 место может выиграть любой человек, а второе только один из выпускников
https://github.com/tshemsedinov/code-with-ai-contest
GitHub
GitHub - tshemsedinov/code-with-ai-contest: Code with AI contest
Code with AI contest. Contribute to tshemsedinov/code-with-ai-contest development by creating an account on GitHub.
👍7❤3🔥1🫡1
Тем, кто накручивает опыт: когда у вас слишком много опыта, то это становится проблемой. Сколько знаю людей с 20-30 лет опыта, то вы в каждой задаче видите столько подводных камней и в каждом проекте столько сложностей, что разработка становится очень проблематичной. Но открутить опыт, который вы накрутили гораздо сложнее...
❤15😁7👍6💯3🔥2
⚡️ Предварительная регистрация на интенсив:
Превращение существующего проекта в «local-first»
1. Обзор основных отличий подхода «local-first»
2. Практическое руководство: Как быстро создать PWA «local-first» из существующего приложения
3. Анализ кода: как добавлять новые сущности, операции, бизнес-логику
👉 Регистрация на мастер-класс по local-first https://forms.gle/ENXGB84bRY4fCiYZ8
Превращение существующего проекта в «local-first»
1. Обзор основных отличий подхода «local-first»
2. Практическое руководство: Как быстро создать PWA «local-first» из существующего приложения
3. Анализ кода: как добавлять новые сущности, операции, бизнес-логику
👉 Регистрация на мастер-класс по local-first https://forms.gle/ENXGB84bRY4fCiYZ8
❤6👍2🔥1
Конкурс «Code with AI»
Призы: 2 места на один из моих курсов:
- Architecture 2025
- Async 2025 for JS/TS
- Patterns 2025 for JS/TS
- Node.js 2024
Задача: https://github.com/tshemsedinov/code-with-ai-contest
Призы: 2 места на один из моих курсов:
- Architecture 2025
- Async 2025 for JS/TS
- Patterns 2025 for JS/TS
- Node.js 2024
Задача: https://github.com/tshemsedinov/code-with-ai-contest
👍5❤3🔥1