Vue.js релизнула v3.4.19
Опять не очень удачно - были добавлены предупреждения пользователям, если computed имеет side effect-ы, однако в соответствующем PR-e сразу посыпались жалобы, что из предупреждения не видно, в каком computed-e проблемы, и даже что чистые computed-ы дают такие предупреждения.
#vue
Опять не очень удачно - были добавлены предупреждения пользователям, если computed имеет side effect-ы, однако в соответствующем PR-e сразу посыпались жалобы, что из предупреждения не видно, в каком computed-e проблемы, и даже что чистые computed-ы дают такие предупреждения.
#vue
GitHub
feat(reactivity): warn users when computeds are not side-effect free by Doctor-wu · Pull Request #10299 · vuejs/core
warn users when computeds are not side-effect-free
refer #10232
refer #10232
Принцип инверсии зависимостей
Буква D в аббревиатуре принципов объектно-ориентированного программирования SOLID означает Dependency inversion principle - Принцип инверсии зависимостей, который очень хорошо применим и во фронтенд разработке.
Он гласит: "Завись от абстракций. Не завись от конкретной реализации".
Другими словами, если у вас есть некая сущность, которая что-то использует, то возможно она должна это делать через интерфейс.
Пример: в ваших компонентах вам надо форматировать дату и время. Вы можете сразу подключить какой-нибудь
Согласно Принципу инверсии зависимостей вам следует создать интерфейс для функций работы с датой - например,
В ООП языках между конкретной реализацией
Таким образом вы можете спокойно работать над проектом с самого начала, не задумываясь, кто именно будет реализовывать логику работы с датами. Вполне возможно, к концу проекта вы увидите, что используете только 3 функции из
То же самое относится к компонентам - обертки
#architecture #solid
Буква D в аббревиатуре принципов объектно-ориентированного программирования SOLID означает Dependency inversion principle - Принцип инверсии зависимостей, который очень хорошо применим и во фронтенд разработке.
Он гласит: "Завись от абстракций. Не завись от конкретной реализации".
Другими словами, если у вас есть некая сущность, которая что-то использует, то возможно она должна это делать через интерфейс.
Пример: в ваших компонентах вам надо форматировать дату и время. Вы можете сразу подключить какой-нибудь
dayjs и использовать его везде. В какой-то момент вы обнаруживаете, что функционала dayjs не хватает, и подключаете date-fns, попутно меняя весь предыдущий код.Согласно Принципу инверсии зависимостей вам следует создать интерфейс для функций работы с датой - например,
dates.ts, в котором прописать свои функции, которые являются обертками над date-fns функциями. В коде вы обращаетесь к этим своим функциям, а их реализация уже лежит в этом файле. Это даёт ту самую loose coupling - слабую связанность.В ООП языках между конкретной реализацией
dates.ts и кода, её использующего, нужно бы было создать промежуточный абстрактный класс DateUtilities - именно его называют в объяснении принципа "абстракцией". В JavaScript он не создается, dates.ts выполняет и его роль.Таким образом вы можете спокойно работать над проектом с самого начала, не задумываясь, кто именно будет реализовывать логику работы с датами. Вполне возможно, к концу проекта вы увидите, что используете только 3 функции из
date-fns, и они вполне могут быть реализованы самостоятельно. Вы избавляетесь от зависимости, делаете бандл легче, приложение - быстрее, и не надо ничего менять в коде, кроме самого dates.ts. Возможно будет иная причина поменять одну зависимость на другую - вы снова это делаете, не меняя основного кода.То же самое относится к компонентам - обертки
BaseButton, BaseIcon, BaseDropdown и т.п. служат этой же цели - значительно облегчить разработку, поддержку и дальнейшее развитие проекта путем снижения привязанности основного кода к конкретным зависимостям.#architecture #solid
FormKit выпустила библиотеку `tempo`, для работы с датой и временем
Tempo - это новая библиотека в ряду библиотек работы с датой и временем JavaScript. Вдохновленная такими библиотеками, как moment.js, day.js и date-fns, Tempo создана с нуля, чтобы быть как можно более маленькой и простой в использовании.
Tempo лучше всего рассматривать как набор утилит для работы с объектами Date - важное отличие от других библиотек, предоставляющих пользовательские примитивы даты. Под капотом Tempo использует JavaScript's Intl.DateTimeFormat для извлечения сложных данных, таких как смещение часовых поясов и форматы дат с учетом локали, предоставляя вам простой API для форматирования, разбора и манипулирования датами.
В коде под капотом действительно все чистенько и tree-shakable.
Но, повторюсь, если вам нужно немного каких-то особенных функции для работы с датами, например,
#formkit #tempo #dates
Tempo - это новая библиотека в ряду библиотек работы с датой и временем JavaScript. Вдохновленная такими библиотеками, как moment.js, day.js и date-fns, Tempo создана с нуля, чтобы быть как можно более маленькой и простой в использовании.
Tempo лучше всего рассматривать как набор утилит для работы с объектами Date - важное отличие от других библиотек, предоставляющих пользовательские примитивы даты. Под капотом Tempo использует JavaScript's Intl.DateTimeFormat для извлечения сложных данных, таких как смещение часовых поясов и форматы дат с учетом локали, предоставляя вам простой API для форматирования, разбора и манипулирования датами.
В коде под капотом действительно все чистенько и tree-shakable.
Но, повторюсь, если вам нужно немного каких-то особенных функции для работы с датами, например,
addHour(), попросите Codeium или другой чат-бот сгенерировать их и, возможно, этого вкупе с Intl.DateTimeFormat вполне хватит#formkit #tempo #dates
GitHub
GitHub - formkit/tempo: 📆 Parse, format, manipulate, and internationalize dates and times in JavaScript and TypeScript.
📆 Parse, format, manipulate, and internationalize dates and times in JavaScript and TypeScript. - formkit/tempo
В математике есть три постоянных величины, встречающихся, наверно, во всех основных её областях - e, π, i, хоть последняя и не действительное число. В то же время, есть еще одна знаменательная постоянная, хоть и не участвующая в великих формулах, но известная многим. Это "золотое сечение" - φ = 1.6180339887498948482...
Во античные времена математика ассоциировалась с красотой мира. Исследую красоту звуков и из сочетаний, Пифагор открыл музыкальную гамму, которая применяется и доныне. Он пришел к выводу, что приятное для слуха созвучие получается когда длины струн (= высоты нот) находятся между собой в простых целочисленных отношениях - типа 1/2, 3/4 и т.д. Так числа определили нотный строй.
#math #webdesign
Во античные времена математика ассоциировалась с красотой мира. Исследую красоту звуков и из сочетаний, Пифагор открыл музыкальную гамму, которая применяется и доныне. Он пришел к выводу, что приятное для слуха созвучие получается когда длины струн (= высоты нот) находятся между собой в простых целочисленных отношениях - типа 1/2, 3/4 и т.д. Так числа определили нотный строй.
#math #webdesign
Попытка применить числовые отношения к визуальному миру, чтобы задать критерии красоты, продвинулись не так далеко. Было принято, что "красивый" прямоугольник это такой, у которого маленькая сторона относится к большой так же, как большая к сумме маленькой и большой. Решение простого квадратного уравнения дает бесконечную дробь: a/b = 1.61803... Её и назвали золотым сечением.
Сразу же получается, что если a/b = 1.61803..., то b/a = 0.61803... Только одно число обладает таким свойством. Отметим, если a/b = φ и b/c = φ, то a/c = φ*φ, и таким образом можно получить ряд уменьшающихся или увеличивающихся гармоничных отрезков, как и с музыкальными нотами и их созвучиями.
#math #webdesign
Сразу же получается, что если a/b = 1.61803..., то b/a = 0.61803... Только одно число обладает таким свойством. Отметим, если a/b = φ и b/c = φ, то a/c = φ*φ, и таким образом можно получить ряд уменьшающихся или увеличивающихся гармоничных отрезков, как и с музыкальными нотами и их созвучиями.
#math #webdesign
Из интересных свойств можно еще отметить, что отношение соседних чисел Фибоначчи при их росте стремится именно к золотому сечению. Другими словами, последующий член последовательности примерно в 1.6 раза больше предыдущего.
Золотое сечение сразу стали, с одной стороны, находить в природе, а с другой - использовать при создании произведений искусств и архитектуры. В наше время им часто руководствуются при создании логотипов для брендов (Apple, Pepsi, Twitter, Google), и веб-дизайна - гармоничное разбиение отрезка на две части.
#math #webdesign
Золотое сечение сразу стали, с одной стороны, находить в природе, а с другой - использовать при создании произведений искусств и архитектуры. В наше время им часто руководствуются при создании логотипов для брендов (Apple, Pepsi, Twitter, Google), и веб-дизайна - гармоничное разбиение отрезка на две части.
#math #webdesign
Лучше всего избегать пустых CSS class атрибутов.
Например, следующий код отобразит
Передавая
#tip
Например, следующий код отобразит
div с пустым атрибутом class:<div :class="isDisabled ? 'disabled' : ''"></div>
<!-- Will render <div class></div> -->
Передавая
null вместо пустой строки, можно избежать отображения пустого атрибута класса:<div :class="isDisabled ? 'disabled' : null"></div>
<!-- Will render <div></div> -->
#tip
Если кто использует большие сторонние библиотеки, например, bootstrap, то с помощью PurgeCSS можно удалить из вашего бандла неиспользуемые стили, коих может быть много, и облегчить его вес.
Библиотека подключается как PostCSS плагин и хорошо настраивается. Можно использовать с Vite.
#css #purgecss
Библиотека подключается как PostCSS плагин и хорошо настраивается. Можно использовать с Vite.
#css #purgecss
Purgecss
PurgeCSS - Remove unused CSS | PurgeCSS
PurgeCSS is a tool to remove unused CSS from your project