mrssea

Новое на веб-платформе в марте

Откройте для себя некоторые интересные функции, появившиеся в стабильных и бета-версиях веб-браузеров в марте 2023 года.

Читать далее… »

14
mrssea

6 CSS-сниппетов, которые должен знать каждый frontend-разработчик в 2023

Каждый фронтенд-разработчик должен знать, как использовать контейнерные запросы, создавать привязку к прокрутке, избегать position: absolute с гридами, быстро создавать круг, использовать каскадные слои и достигать большего с меньшими затратами с помощью логических свойств. Вот краткий обзор каждого из этих ожиданий.

Читать далее… »

664
mrssea

Chrome 112 beta

CSS Nesting, animation-composition и параметр отправителя для конструктора FormData.

Если не указано иное, описанные ниже изменения относятся к новейшему выпуску бета-канала Chrome для Android, ChromeOS, Linux, macOS и Windows. Узнайте больше о перечисленных здесь функциях по предоставленным ссылкам или из списка на ChromeStatus.com. Бета-версия Chrome 112 доступна с 9 марта 2023 года. Вы можете скачать последнюю версию на Google.com для ПК или в Google Play Store для Android.

Читать далее… »

89
mrssea

Новое на веб-платформе в феврале

Откройте для себя некоторые интересные функции, появившиеся в стабильных и бета-версиях веб-браузеров в феврале 2023 года.

Стабильные версии браузера

В феврале 2023 года Firefox 110 и Chrome 110 стали стабильными. Давайте посмотрим, что это означает для веб-платформы.

Читать далее… »

107
mrssea

Лучшие практики для создания веб-компонентов

Многие уже знают, насколько полезными могут быть веб-компоненты. Они предоставляют множество преимуществ, которые могут помочь в создании веб-приложений, или системы дизайна, или просто при создании чего-то, что будет переиспользовано в ваших приложениях. Читать далее… »

128
mrssea

Лучшие практики по пользовательским элементам

Статья вышла в 2017 году, но и сейчас не теряет актуальности. т.к. я не нашла ее в переводе на русский язык, решила перевести сама.

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

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

Чтобы помочь вам создать наилучшие впечатления, мы составили этот чеклист — все, что, по нашему мнению, необходимо для того, чтобы пользовательский элемент вел себя хорошо.

Читать далее… »

123
strokoff

Обработка HTTP-запросов в больших Vue.js-приложениях

vuejs axios

В этой статье я хочу рассказать как сохранить архитектуру приложения при использовании разных типов http-запросов и какие библиотеки можно использовать в приложении. Читать далее… »

445
strokoff

Оптимизируем Vue.js приложение при помощи ‘v-once’ и ‘v-memo’

v-once v-memo vuejs

Как v-once и v-memo могут помочь уменьшить количество повторных рендеров и оптимизировать ваш код.

Читать далее… »

657
devy

Анимация без jQuery

Есть ошибочное мнение среди веб-разработчиков, что CSS анимация — единственный производительный способ анимирования в сети. Этот миф принудил много разработчиков отказаться от основанной на JavaScript анимации в целом. Таким образом:

  1. Вынудили себя управлять сложным взаимодействием UI в таблицах стилей
  2. Блокировали себя в поддержке Internet Explorer 8 и 9
  3. Воздерживаются от возможности построения физики движения, которая возможна только в JavaScript

Проверка в реальных условиях: основанная на JavaScript анимация так же быстра, как и анимация, основанная на CSS — иногда еще быстрее. Анимация CSS имеет преимущество, как правило, только по сравнению с $.animate() jQuery, которая является, по сути, очень медленным. Однако библиотеки для анимации JavaScript, которые обходят jQuery, показывают невероятную производительность, избегая манипулирования DOM насколько это возможно. Эти библиотеки могут быть до 20 раз быстрее, чем jQuery.

Так, давайте развеем некоторые мифы, погрузимся в некоторые реальные примеры анимации и улучшим наши навыки программирования в процессе. Если вы любите разрабатывать практичные UI анимации для своих проектов, то эта статья для вас.

Читать далее… »

24307
devy

Front-end производительность для веб-дизайнеров и front-end разработчиков.

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

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

В этой статье я собираюсь совместно использовать  загрузку быстрых, простых и совершенно интригующих битов знаний о производительности, чтобы действовать как учебник для начинающих веб-дизайнеров и front-end разработчиков; надеюсь, эта статья будет приличным введением для любого желающего узнать о производительности. Эти подсказки — это вещи, которые вы можете сами очень легко реализовать. Просто требуется немного хитрости и некоторые элементарные знания того, как работают браузеры. И вы готовы играть по правилам!

Этот огромная статья не будет грузить запутанными графиками и числами, это будет интересная теория и непосредственно методы производительности, к которым я пришел в результате чтения, прослушивания и мониторинга.

Читать далее… »

10973
12»