​Программное создание изображений с помощью CSS Painting API

Большое количество изображений на странице плохо влияет на скорость её загрузки. Для решения этой проблемы создан CSS Painting API, который позволяет программно отрисовывать изображения, не загружая их извне.

Пока что не все браузеры поддерживают эту технологию, но благодаря этой статье у вас есть возможность изучить принцип работы API и подготовиться к его внедрению в опаздывающие браузеры:

https://tprg.ru/QBhg

#фронтенд #css

Управление памятью в JavaScript

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

В этой статье рассказываем о том, как устроена память в JavaScript: жизненный цикл, стек, куча и так далее. Эти знания помогут вам избежать многих проблем и лучше понимать устройство кода:

https://tprg.ru/iQ6A

#javascript

​7 вопросов по замыканиям JavaScript

JavaScript-разработчику необходимо разбираться в таких вопросах, как замыкание функции. Да и на собеседованиях любят спрашивать про них.

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

https://tprg.ru/FkU7

#javascript

Создание анимированных плейсхолдеров на HTML и CSS

В этой небольшом руководстве вам расскажут, как можно быстро создать анимированный плейсхолдер для контента, который пока что не успел загрузиться:

https://tprg.ru/xgq2

#фронтенд #html #css

Страшно представить, как там медиа-запросы реализованы

Создание уменьшающейся шапки сайта без JavaScript

Следуя этому руководству, вы сможете создать красивый хэдер сайта, который будет уменьшаться при прокрутке страницы, экономя полезное пространство. А отсутствие JavaScript ещё и ресурсы сэкономит.

Делается это несложно, вот посмотрите:

https://tprg.ru/ogcS

#фронтенд #css

PHP 8 и развитие языка в 30 вопросах и ответах

Автору статьи удалось пообщаться с ключевыми контрибьюторами ядра PHP, задать им несколько вопросов и получить на них ответы.

О том, планируется ли дальнейшее развитие type hinting, какое будущее у FFI, зачем добавляют mixed type и другие ответы на острые вопросы можно прочитать тут:

https://tprg.ru/snbc

#php

Настройка размера контейнера в CSS Grid

Автор статьи столкнулся с такой проблемой, как неработающая прокрутка у контейнера. Вместо этого все блоки внутри контейнера располагались в ряд, вылезая за допустимые границы.

В этой статье он делится тем, как это исправить и почему это может случиться:

https://tprg.ru/kQpw

#фронтенд #css

Не очень то и хотелось

​Задача для практики

Представьте, что вы кладовщик, и на склад поступило что-то ну очень крупногабаритное. У вас есть схема склада в виде многомерного массива, где 0 — это занятое место, а 1 — свободное. Исходя из заполненности склада определите наиболее крупный прямоугольник свободного пространства, где вы бы могли разместить неизвестную махину.

Так, например для массива:

matrix =
[
[1,0,1,1,1],
[0,1,1,0,1],
[0,1,1,0,1],
[0,1,1,0,1],
]

Площадь самого большого прямоугольника будет равна 6.

Попробуйте решить самостоятельно, а через пару часов мы опубликуем вариант решения.

#задача

Решение задачи

Ну что? Получилось решить? Поделитесь вашим вариантом с нами.

А если не получилось или вам просто интересно узнать другой вариант решения, то посмотреть его можно тут:

https://tprg.ru/PVO6

Разработка производительного пользовательского курсора

Вы хотели когда-нибудь создать настолько уникальный сайт, где даже курсор отличается от обычного? Иногда это действительно смотрится круто и даже уместнее, чем стандартный курсор.

Если хотите научиться создавать и применять свой собственный курсор на сайте, прочитайте эту статью:

https://tprg.ru/9HOZ

#фронтенд

​«Заходят в бар Уразбаев, Могелашвили и Дорофеев...»

2 марта пройдёт первый митап нового сезона «Инженер заходит в бар» — онлайн-встреч, где инженеры разговаривают на профессиональные темы, не связанные с написанием кода.

Эксперты
— Асхат Уразбаев, управляющий партнёр, ScrumTrek
— Максим Дорофеев, прокрастинатолог в mnogosdelal.ru
— Георгий Могелашвили, Mentor/Coach, Lead Developer в Booking.com"

В новом сезоне разберут различные траектории профессионального развития для инженеров. Начнут с консультантов — обсудят, как их угораздило уйти из разработки в Agile и менторство-коучинг.

Регистрация и детали: https://miro-event.timepad.ru/event/1551602/

​Создание объемной фигуры из текста с анимацией на HTML и CSS

Небольшой видеоурок по созданию интересной анимации из текста от нашего подписчика.

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

https://tprg.ru/DIat

#фронтенд #html #css

​Руководство по React для разработчика Vue.js

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

Если вы уже хорошо освоили Vue, то следующим шагом может стать изучение не менее популярного React. В этой статье помогают разобраться в принципах работы библиотеки, проводя аналогии с Vue.js:

https://tprg.ru/FDcI

#фронтенд #react #vue

25 полезных плагинов и библиотек JavaScript, о которых вы можете не знать

Многие наслышаны о таких фреймворках, как Vue, Angular, библиотеке React и прочих популярных решения для JavaScript.

Но в этой подборке собраны 25 инструментов, которые могут оказаться не менее полезны во время разработки, но не такие известные. Тут вы найдёте такие библиотеки, как Algolia Places, Anime.js, Cleave.js и другие:

https://tprg.ru/uP8b

#javascript

​Зачем нужен и как работает Docker

Видео для начинающих веб-разработчиков, в котором понятно и с картинками рассказывают, как появился, работает и зачем нужен Docker:

https://tprg.ru/DdVH

#docker #видео

​15 методов работы с HTML-элементами в JS про которые вы могли не знать

При работе с DOM в JavaScript обычно используют такие методы, как .querySelector(), .createElement и связанные с ними. Но в JavaScript существует множество различных вариантов и методов для взаимодействия с HTML.

В этой статье представлены 15 различных методов работы с HTML-элементами в JavaScript:

https://tprg.ru/rhWS

#html #javascript

Просто нужно примириться с этой болью

​Оптимизация видео на странице по размеру и качеству

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

Автор статьи на реальном примере показал, что может вызывать проблемы с отображением и загрузкой видео, и как с этим можно бороться. Подробнее тут:

https://tprg.ru/tfJc

#фронтенд