Pull to refresh
41
6
Frontend по-флотски @qmzik

User

Send message

Svelte 5 здесь

Level of difficultyEasy
Reading time5 min
Views3.8K

После почти 18 месяцев разработки, включающей тысячи коммитов от десятков участников, Svelte 5 наконец‑то стабилен.

Это самый значительный релиз в истории проекта. Svelte 5 — это полная переработка: ваши приложения станут быстрее, меньше и надежнее. Вы сможете писать более последовательный и идиоматичный код. Новичкам в фреймворке предстоит изучить меньше материала.

Читать далее
Total votes 12: ↑12 and ↓0+16
Comments5

Что нового в Chrome 130?

Level of difficultyEasy
Reading time3 min
Views3.3K

Вот что вам нужно знать:

Document "picture-in-picture" дает вам больше возможностей для управления окнами "picture-in-picture".

Вложенные объявления в CSS - исправление некоторых сложных ситуаций.

Вы можете задать поведение декораций для элементов, которые разделяются на несколько строк.

И многое другое.

Читать далее
Total votes 6: ↑2 and ↓4-1
Comments3

Улучшение производительности рендеринга с помощью CSS content-visibility

Level of difficultyEasy
Reading time5 min
Views7.1K

Недавно я обнаружил интересную ошибку в работе emoji-picker-element:

Я работаю на экземпляре fedi с 19 тыс. пользовательских эмодзи [...], и когда я открываю панель выбора эмодзи [...], страница замирает как минимум на целую секунду, а после этого на некоторое время замирает общая производительность.

Если вы не знакомы с Mastodon или Fediverse, то на разных серверах могут быть свои собственные эмодзи, как в Slack, Discord и т.д. Наличие 19k (на самом деле ближе к 20k в данном случае) крайне необычно, но не является чем-то неслыханным.

Читать далее
Total votes 11: ↑11 and ↓0+16
Comments3

Вышел TypeScript 5.6

Level of difficultyEasy
Reading time19 min
Views3.6K

Сегодня мы рады объявить о выходе TypeScript 5.6!

Если вы не знакомы с TypeScript, то это язык, созданный на основе JavaScript и добавляющий синтаксис для типов. Типы описывают формы, которые мы ожидаем от наших переменных, параметров и функций, а программа проверки типов TypeScript помогает выявить такие проблемы, как опечатки, отсутствие свойств и неправильные вызовы функций еще до того, как мы запустим наш код. Типы также используются в редакторах TypeScript, таких как автозавершение, навигация по коду и рефакторинг, которые вы можете увидеть в таких редакторах, как Visual Studio и VS Code. На самом деле, если вы пишете JavaScript в любом из этих редакторов, этот опыт основан на TypeScript! Узнать больше можно на сайте TypeScript.

Читать далее
Total votes 11: ↑10 and ↓1+11
Comments0

Вышел Vue 3.5

Level of difficultyEasy
Reading time5 min
Views16K

Сегодня мы рады сообщить о выходе Vue 3.5 "Tengen Toppa Gurren Lagann"!

Этот минорный релиз не содержит кардинальных изменений и включает в себя как внутренние улучшения, так и новые полезные функции. Мы расскажем о некоторых основных моментах в этом блоге - полный список изменений и новых возможностей можно найти в полном журнале изменений на GitHub.

Читать далее
Total votes 29: ↑29 and ↓0+37
Comments2

React Custom Hooks vs. Helper Functions — когда какой вариант использовать

Level of difficultyEasy
Reading time10 min
Views3.2K

При работе довольно часто приходится сталкиваться с различными технологиями и сценариями использования на ежедневной основе. Две популярные концепции — это React Custom Hooks и Helper functions. Концепция Helper functions существует уже очень давно, в то время как React Custom Hooks все еще достаточно современна. Обе концепции позволяют разработчикам абстрагироваться и повторно использовать код, который они пишут, разными способами, хотя они оба имеют немного разные сценарии использования.

Сегодня мы рассмотрим сходства между этими двумя концепциями и сделаем вывод о том, когда правильнее всего использовать каждую из них.

Читать далее
Total votes 6: ↑0 and ↓6-6
Comments3

Путь к потрясающему CSS Easing с помощью новой функции linear()

Level of difficultyEasy
Reading time9 min
Views5.1K

С появлением на горизонте новой CSS функции linear() возможности создания естественных анимаций и переходов в будущем значительно расширяются. В этой статье Джейхи Томпкинс рассматривает текущее состояние CSS easing и демонстрирует, чего можно ожидать от linear(), включая удобные инструменты для работы с ней уже сегодня.

Читать далее
Total votes 9: ↑9 and ↓0+11
Comments0

Представляем Firebolt: Продуктивный React фреймворк

Level of difficultyEasy
Reading time2 min
Views4.7K

Создание веб-приложений должно быть простым...

К сожалению, современная веб-разработка постепенно становится все более сложной и запутанной. Веб всегда был просто вебом, так почему же он не стал проще? Почему мы не становимся более продуктивными?

Сегодня мы рады публично представить Firebolt: новый вид фреймворка react для создания веб приложений. В Firebolt собрано все, чему мы научились за последние несколько лет, и сведено в крошечный, молниеносно быстрый фреймворк, созданный для того, чтобы вы работали продуктивно и приносили пользу.

Читать далее
Total votes 9: ↑6 and ↓3+4
Comments14

Когда «as never» — единственное, что работает

Level of difficultyEasy
Reading time3 min
Views7.8K

as never, очень редко требуется в TypeScript. Давайте рассмотрим пример, где это необходимо.

Представим, что мы хотим отформатировать некоторый ввод на основе его typeof. Сначала мы создадим объект formatters, который сопоставит typeof с функцией форматирования:

Читать далее
Total votes 8: ↑4 and ↓4+4
Comments18

Типы событий в React и TypeScript

Level of difficultyEasy
Reading time3 min
Views13K

При работе с React и TypeScript вы часто сталкиваетесь с подобными ошибками:

const onChange = (e) => {}; // Parameter 'e' implicitly has an 'any' type.

<input onChange={onChange} />;

Не всегда понятно, какой тип следует присвоить пременнойe внутри функции onChange.

Это может произойти с onClick, onSubmit или любым другим обработчиком событий, которые получают элементы DOM.

К счастью, есть несколько решений:

Читать далее
Total votes 4: ↑2 and ↓20
Comments5

Функция TypeScript 5.3, о которой вам не рассказали

Level of difficultyMedium
Reading time3 min
Views11K

20 ноября команда TypeScript выпустила TS 5.3.

Как обычно, я просканировал сообщение об анонсе, но быстро заметил кое-что интересное.

Одно из самых важных изменений в TypeScript 5.3 не было упомянуто в примечаниях к релизу.

Читать далее
Total votes 12: ↑11 and ↓1+11
Comments0

Встречаем Angular 17

Level of difficultyEasy
Reading time17 min
Views24K

В прошлом месяце исполнилось 13 лет с момента появления "красного щита" Angular. AngularJS стал отправной точкой для новой волны JavaScript-фреймворков, появившихся для поддержки растущей потребности в богатом веб-опыте. Сегодня с новым внешним видом и набором перспективных функций мы ведем всех в будущее с версией 17, устанавливая новые стандарты производительности и удобства для разработчиков.

Читать далее
Total votes 10: ↑10 and ↓0+10
Comments6

Что нового в Chrome 119?

Level of difficultyEasy
Reading time3 min
Views6.6K

Начиная с Chrome 104 для вновь созданных или обновленных файлов cookie с указанием даты истечения срока действия действует ограничение - не более 400 дней. Теперь это ограничение будет применено к уже хранящимся файлам cookie задним числом.

После первого запуска Chrome 119+ и однократного переноса базы данных срок действия этих файлов будет ограничен до 400 дней. Влияние этого изменения пользователи смогут ощутить не ранее чем через 400 дней после выхода Chrome 119, и то только для существующих файлов cookie, которые не были обновлены за это время.

Более подробно о рекомендации по срокам действия можно прочитать здесь, а сейчас - дружеское напоминание о том, что в ближайшем будущем сторонние файлы cookie будут устаревшими, и руководство по подготовке к этому.

Читать далее
Total votes 3: ↑2 and ↓1+2
Comments3

Вышел Chrome 118

Level of difficultyEasy
Reading time4 min
Views5.7K

CSS @scope.

Правило @scope at-rule позволяет разработчикам распространять правила стилей на заданный корень описания и стилизовать элементы в соответствии с близостью к этому корню.

С помощью @scope можно отменять стили, основанные на близости, что отличается от обычных стилей CSS, которые применяются только на основе порядка и специфики источника. В следующем примере имеется две темы.

Читать далее
Total votes 9: ↑9 and ↓0+9
Comments2

Svelte: Знакомство с рунами

Level of difficultyEasy
Reading time5 min
Views9.2K

В 2019 году Svelte 3 превратил JavaScript в реактивный язык. Svelte - это фреймворк для создания веб-интерфейса, который использует компилятор для превращения декларативного кода компонентов в такой...

Читать далее
Total votes 8: ↑7 and ↓1+9
Comments22

Что нового в Chrome 117?

Level of difficultyEasy
Reading time4 min
Views6.9K

Что ожидается в статье:

Три новые функции CSS позволяют легко добавлять плавные анимации появления и исчезновения.

Вычисление наборов данных более высокого порядка с помощью группировки массивов.

DevTools упрощает процесс локальных переопределений.

И многое другое.

Читать далее
Total votes 5: ↑5 and ↓0+5
Comments3

Типизированные CSS переменные с @property

Level of difficultyEasy
Reading time4 min
Views5.7K

Типы CSS - это достойное вложение в безопасность типов при работе с внешним интерфейсом. Мы все еще ожидаем кроссбраузерности, но мы к этому придем ? .

Читать далее
Total votes 6: ↑6 and ↓0+6
Comments2

Вышел Chrome 116

Level of difficultyEasy
Reading time3 min
Views6.1K

Традиционный перевод анонса от команды Google Chrome о нововведениях

• Document Picture-in-Picture API

• Улучшена отладка отсутствующих таблиц стилей в DevTools

• Свойство notRestoredReasons

И многое другое!

Читать далее
Total votes 3: ↑3 and ↓0+3
Comments1

Встречайте Next.js Commerce 2.0

Level of difficultyEasy
Reading time9 min
Views7.4K

Сегодня мы с радостью представляем Next.js Commerce 2.0.

App Router Ready: Использование компонентов React Server, Server Actions, встроенных лейаутов, метаданных и всех новых шаблонов из недавно выпущенного App Router.

Динамическая витрина: Динамическая витрина с Edge-рендерингом, работающая со скоростью статической. Настраивайте содержимое без не жертвуя производительностью.

Упрощенная архитектура: Next.js Commerce теперь представляет собой один провайдер на репозиторий, что позволяет сократить объем кода и уменьшить количество абстракций для вашего приложения.

Наш новый шаблон-акселератор интернет-магазина демонстрирует лучшие шаблоны для создания составных коммерческих приложений, включая поддержку BigCommerce, Medusa, Saleor, Shopify и Swell.

Читать далее
Total votes 9: ↑8 and ↓1+7
Comments0

TypeScript 5.2: Новое ключевое слово: 'using'

Level of difficultyEasy
Reading time2 min
Views6.1K

В TypeScript 5.2 появится новое ключевое слово 'using', которое можно будет использовать для утилизации чего-либо с помощью функции Symbol.dispose, когда оно покидает область видимости.

Читать далее
Total votes 9: ↑2 and ↓7-5
Comments5

Information

Rating
902-nd
Registered
Activity