JavaScript Daily | Frontend
316 subscribers
354 photos
151 links
Всё самое интересное из мира веб-разработки за сегодня.

Для связи - art.diontev@ya.ru
Download Telegram
Пять способов уменьшить размер бандла JavaScript

Оптимизация вашего приложения с помощью разделения кода на чанки, техники Tree Shaking`а, удаления ненужных библиотек и дублирования кода, компрессии бандла и prod-режима Webpack.
JavaScript | Практика #73
#js_practice_easy
JavaScript | Практика #73

Какой будет результат?
Anonymous Quiz
21%
10, 10
32%
10, 11
11%
11, 11
37%
11, 12
Пара интересных pen`ов на хэллоуинскую тематику

https://codepen.io/panvicka/pen/ExvYjNR - выпадающее меню с интересной анимацией при выборе элемента списка.

https://codepen.io/cobra_winfrey/pen/zYzVmWX - тоже dropdown, но с более классическим поведением.

#codepen
Иммутабельность объектов в JavaScript

Неизменяемость объекта является важной концепцией в любом языке программирования. Она ограничивает изменения объектов и предотвращает нежелательные операции с ними.

В статье автор рассказывает, как мы можем реализовать иммутабельность объектов в JavaScript с помощью методов freeze() и seal().
JavaScript | Теория #16

Сколько операторов сравнения величин есть в JavaScript?
Anonymous Quiz
9%
Один
25%
Два
59%
Три
7%
В JS нет операторов сравнения
Борьба с гонками (race conditions) в JavaScript на примере работы с кешем

Короткий разбор особенностей работы async / await и Promise.all при кешировании запросов.
CSS | Практика #8
#css_practice_easy
CSS | Практика #8

Как выровнять блок #child по-центру?
Anonymous Quiz
15%
text-align: center;
27%
justify-content: center;
8%
align-self: center;
50%
margin: auto;
Как сделать Змейку на чекбоксах и не только

Забавный мини-проект с анимацией из простых чекбоксов. В посте можно найти несколько примеров реализации, ну а поиграться с демками можно тут - https://www.bryanbraun.com/checkboxland/
JavaScript | Практика #74
#js_practice_medium
JavaScript | Практика #74

Что будет на выходе?
Anonymous Quiz
26%
1, 2, 4, 5
19%
4, 5
29%
1, 4, 5
26%
1, 2
Blazor WebAssembly: соединительные линии в SVG

В статье описан способ реализации соединительных линий между SVG объектами. Соединительные линии автоматически перестраиваются при изменении положения объектов.

Демо - https://alexeyboiko.github.io/BlazorDraggableDemo/
Как создать блок с градиентной обводкой?

Представим ситуацию: перед вами встало сверх задание — нужно сделать на сайте блок с градиентной обводкой. Нужно сразу понимать, что для этого не существует простого и очевидного CSS API. Это значит, что для получения необходимого визуального эффекта нам нужно писать определенные “костыли”. Автор предлагает рассмотреть 2 подхода к решению этой задачи.
Базовые задачи на Promise в JavaScript

Promise - специальный объект, который хранит своё состояние и используется для обработки результатов асинхронных операций.

В статье - основные задачи на Promsie, которые часто спрашивают на собеседованиях.
Использование Google reCAPTCHA v2 и v3 в одной форме

Пост с примерами кода о том, как применить Google капчу: не пропустить робота и оставить в покое пользователя.
JavaScript | Практика #75
#js_practice_medium
JavaScript | Практика #75

Что будет в консоли?
Anonymous Quiz
16%
20, 40, 80, 160
18%
20, 40, 20, 40
29%
20, 20, 20, 40
37%
NaN, NaN, 20, 40
JavaScript | Практика #76
#js_practice_easy