Утечки памяти в SSR

Меня зовут Владимир Захаров, я расскажу про утечки памяти в SSR. На самом деле, утечки могут случиться в JavaScript везде – и на сервер-сайде, и на клиенте, поэтому информация будет полезна даже тем, у кого пока нет SSR. Давайте чуть подробнее познакомимся. Я ведущий фронтэнд-разработчик, около 8 лет в отрасли. В Зарплате.ру больше не работаю, но основной опыт, о котором хочу рассказать, получен именно там. Я люблю плавающие баги, разговоры о техдолге и шутки про ненастоящих программистов. Поговорим про утечки памяти в SSR, про работу с памятью и про то, как всё это выглядит в браузере и в nodejs. Ну, и естественно, как со всем этим жить.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью

Геттеры и сеттеры

В этом примере класс Rectangle имеет геттер area, который вычисляет площадь, и сеттер width, который позволяет изменять ширину, но только если новое значение положительное.

#классы

Скрытие POI за зданиями

C 2018 года карта на 2gis.ru рендерится при помощи WebGL API для рисования трехмерной графики. Сначала мы в команде веб-карт использовали эту технологию просто как очень быструю рисовалку двухмерных данных с небольшими исключениями в виде 3D-домов и моделей.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью

Статические методы

Статические методы класса могут вызываться непосредственно на самом классе, без создания экземпляра. В этом примере класс MathUtils содержит статические методы для сложения и вычитания чисел.

#классы

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

Три новые функции CSS позволяют легко добавлять плавные анимации появления и исчезновения.
Вычисление наборов данных более высокого порядка с помощью группировки массивов.
DevTools упрощает процесс локальных переопределений.
И многое другое.
Я Адриана Джара. Давайте узнаем, что нового ждет разработчиков в Chrome 117.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью

Использование геттеров и сеттеров

В этом примере класс Person использует геттер и сеттер для получения и установки полного имени.

#классы

Видеоредактор, работа с видео и зачем там Canvas

Одной из задач, где мы в Ozon используем Canvas, является обработка видео. Для это у нас реализован минималистичный видеоредактор.
Современные устройства и браузеры развиваются достаточно быстро, но все-равно этого бывает недостаточно для задач со сложными вычислениями. К таким задачам можно отнести обработку видео.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью

Использование классов как функции конструкторов

Здесь мы используем функцию конструктора Car для создания объекта. Мы добавляем метод getFullName к прототипу Car, чтобы он был доступен для всех экземпляров класса.

#классы

Kysely.js типизированный sql builder

Kysely.js – это библиотека, позволяющая писать типизированные SQL запросы. Библиотека делает работу с SQL в вашем проекте более безопасной, избавляя от таких ошибок как опечатки в названиях колонок или таблиц и неправильное использование SQL операторов в коде (код не скомпилируется). Ко всему прочему она делает работу с SQL более удобной, предоставляя при написании запросов автодополнения для таблиц, колонок, алиасов и других сущностей. Kysely имеет незначительный слой абстракции над SQL для того чтобы можно было пользоваться всей мощью SQL и при этом не изучать множество дополнительных сущностей. Библиотека поддерживает MySQL, PostgreSQL, SQLite, PlanetScale, D3, SurrealDB и другие.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью

Работа с классами

В этом примере мы создаем классы Animal и Dog. Dog наследует от Animal, и мы переопределяем метод makeSound для класса Dog, чтобы он вел себя по-разному. Это демонстрирует наследование и переопределение методов в классах JavaScript.

#классы

Веб-компоненты в 2023: нужно поговорить

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

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью

Использование классов для создания интерактивных элементов на веб-странице

Класс InteractiveElement добавляет интерактивность к элементам на веб-странице, в данном случае, обрабатывая событие клика на кнопке.

#классы

JavaScript. WebRTC. Соединение браузеров напрямую без сервера, peer-to-peer

WebRTC позволяет браузерам обмениваться информацией напрямую без сервера. Можно передавать видео, звук и данные.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью

Использование классов для создания часов

Класс Clock создает объект, который отображает текущее время и обновляет его каждую секунду.

#классы

Создаем мини-игру с капельным эффектом и движущимися кружками

В первой части было сделано базовое перемещение кружочков по странице. А в сегодняшнем уроке мы сделаем анимацию “взрыва” и поглощения кружочков.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью

Использование классов для создания плеера видео

Класс VideoPlayer может использоваться для создания проигрывателя видео на веб-странице.

#классы

Как вам такой адаптивчик?)

#юмор

🫡 Накидайте реакций, если понравился формат

Web Accessibility в рассказе «A11Y от 0 до NaN»

Данной статьёй я планирую рассказать про интересные случаи и про то, в каких ситуациях можно оказаться, постигая новые горизонты, но не собираюсь даже пытаться заменить справочники по aria-атрибутам и эталонным примерам доступных компонентов. Стандарт W3C полон полезной информации, которая сдержанно подаёт только нужное.

#статья

❤️ Прожимай реакции, если нравится такой формат

👉 Читать статью

Использование классов для создания графических элементов

Здесь класс Rectangle представляет графический элемент (прямоугольник) и может использоваться для рисования на холсте HTML5.

#классы

Чисто рутина 😅

#юмор

🫡 Накидайте реакций, если понравился формат