Frontend.code - JS Разработка
218 subscribers
81 photos
1 video
79 links
Надежный источник знаний и вдохновения в мире frontend разработки.

https://t.me/frontenddotcode?boost

Практические примеры кода, подробные туториалы, советы от опытного разработчика, обзоры последних инструментов и технологий
Download Telegram
Map()

Метод .map() создает новый массив путем применения переданной функции к каждому элементу.

Один из самых часто используемых методов js

#junior #base #function
Please open Telegram to view this post
VIEW IN TELEGRAM
👍5
Новый VITE 4.3

На днях выкатили новую версию vite, улучшили производительность, причем очень даже неплохо.

На изображениях сравнивается новая и старая версия

HMR - Hot Module Replacement, Замена модулей в приложении без перезагрузки страницы

SWC - компилятор на Rust (альтернатива `babel`)


Ссылка на релиз

#vite #release #news #js
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
👍5
Reduce

Метод .reduce() применяется для преобразования массива в новое значение на основе функции, переданной в качестве аргумента.

Часто используется при работе с массивами

#junior #base #function
Please open Telegram to view this post
VIEW IN TELEGRAM
👍4
Box-shadow, анимация и производительность

Анимация тени на элементах не лучший вариант. Такая анимация может повлиять на производительность. Автор рассматривает различные методы оптимизации и ускорения анимации.

Ссылка на статью

Если кратко, идеальный вариант - это отсутствие анимации тени 😄 Но даже если она вам требуется, анимируйте не сам box-shadow, а псевдоэлемент дающий тень. Так перерисовок будет меньше.

#html #css #animation
👍6
Рефакторинг кода

Хороший код не нуждается в комментариях. Вернее нуждаться могут не только лишь все, мало кто может это сделать.

Ссылка на статью

Вот выжимка, это база.

- Используй константы вместо магических значений (в комментах под постом есть горячее обсуждение по этому поводу)
- Упрощай, путем вынесения кода в отдельные функции (в пределах разумного)
- Повторяемые куски кода выноси в отдельные функции

#base #js
Please open Telegram to view this post
VIEW IN TELEGRAM
👍5
ES14

В июне ожидается выпуск нового стандарта. Изменений немного:
- 2 новых типа данных (полностью неизменяемый объект и массив)
- новые методы для массивов
- поиск элемента с конца: findLastIndex и findLast
- Символы в качестве ключей для WeakMap.
- Hashbang

Если раньше для сортировки массива нам требовалось его скопировать, чтобы исходник не менялся (так как sort изменяет массив напрямую), а потом сортировать, то теперь мы можем использовать метод toSorted для возвращения отсортированного массива

[...arr].sort() => arr.toSorted()
Результат один, а глазу приятней.

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


Полный список нововведений

#news #es14 #js
Please open Telegram to view this post
VIEW IN TELEGRAM
👍6👌1