Tailwind CSS v4.0 is here 🔥
Yesterday my colleague told me about the new Tailwind 4 and I didnt expect that much changes.
Faster builds, modern features, and so much more - it’s packed with everything we’ve been waiting for. Let me list the most interesting and key things:
Insane Performance Boost📈
- Full builds are now 5x faster (yes, really)
- Incremental builds? 100x faster - perfect for quick iterations
Modern CSS Awesomeness🎨
- We finally have cascade layers
- Custom properties are registered automatically
- Plus, color-mix() support for advanced color manipulation
Setup Made Simple🛠
- All it takes is one line of code to get started
- And there’s a new Vite plugin that integrates beautifully
Customize in Your CSS👩💻
- Forget hunting through config files - just tweak directly in your CSS.
Cool New Features🆕
- Container queries for responsive magic.
- 3D transform utilities for some creative flair.
- Expanded gradient APIs for stunning visuals.
Full update log
#tailwind #webdev #frontenddeveloper #frontend
Yesterday my colleague told me about the new Tailwind 4 and I didnt expect that much changes.
Faster builds, modern features, and so much more - it’s packed with everything we’ve been waiting for. Let me list the most interesting and key things:
Insane Performance Boost
- Full builds are now 5x faster (yes, really)
- Incremental builds? 100x faster - perfect for quick iterations
Modern CSS Awesomeness
- We finally have cascade layers
- Custom properties are registered automatically
- Plus, color-mix() support for advanced color manipulation
Setup Made Simple
- All it takes is one line of code to get started
- And there’s a new Vite plugin that integrates beautifully
Customize in Your CSS
- Forget hunting through config files - just tweak directly in your CSS.
Cool New Features
- Container queries for responsive magic.
- 3D transform utilities for some creative flair.
- Expanded gradient APIs for stunning visuals.
Full update log
#tailwind #webdev #frontenddeveloper #frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
Tailwindcss
Tailwind CSS v4.0
We just released Tailwind CSS v4.0 — an all-new version of the framework optimized for performance and flexibility, with a reimagined configuration and customization experience, and taking full advantage of the latest advancements the web platform has to…
Последние пару недель пилим интересный проект — встраиваемые виджеты. И хотел бы поделиться архитектурными решениями.
Что строим?
Два встраиваемых виджета с одним общим ядром, которое они переиспользуют
Решения
Решил вспомнить универские годы, когда все пытались делать по книжке и красиво. И вот к чему пришли.
1. Vanilla JS, без фреймворков 🌚 Зачему?
- BundleSize: 125KB
- 0 конфликтов с хостом
- Встаривается через
2. Finite State Machine
Всегда одно явное глобавльное состояние у виджета.
3. Event-Driven
Компоненты общаются через события. Слабая связанность и легко тестировать
4. Также, спасибо ИИшкам, учли
- XSS защиту
- Sanitization
- Валидацию инпутов
Из минусов:
- Надо было изначально писать все на TS, чтобы много где не прописывать типы через JSDoc
- Используется long-polling(бек заставил)
- Многа строк у основных виджетов(из-за JSDoc :( )
- Заметил сложность с локализацией(пока думаю как лучше сделать)
#javascript #architecture #webdev
Что строим?
Два встраиваемых виджета с одним общим ядром, которое они переиспользуют
Решения
Решил вспомнить универские годы, когда все пытались делать по книжке и красиво. И вот к чему пришли.
1. Vanilla JS, без фреймворков 🌚 Зачему?
- BundleSize: 125KB
- 0 конфликтов с хостом
- Встаривается через
<script>2. Finite State Machine
Всегда одно явное глобавльное состояние у виджета.
3. Event-Driven
Компоненты общаются через события. Слабая связанность и легко тестировать
4. Также, спасибо ИИшкам, учли
- XSS защиту
- Sanitization
- Валидацию инпутов
Из минусов:
- Надо было изначально писать все на TS, чтобы много где не прописывать типы через JSDoc
- Используется long-polling(бек заставил)
- Многа строк у основных виджетов(из-за JSDoc :( )
- Заметил сложность с локализацией(пока думаю как лучше сделать)
#javascript #architecture #webdev
1👍5