Webpack — это модульный сборщик (bundler) с открытым исходным кодом, написанный на JS. Он берёт несколько скриптов JavaScript с их зависимостями и объединяет в файл, который используется браузером.
Почему разработчики выбирают именно его, а не другие бандлеры? Webpack отличается подробной документацией и активным коммьюнити. Кроме этого, он имеет ряд преимуществ по сравнению с аналогами.
🌐Подробнее
Made in HTML/CSS
Почему разработчики выбирают именно его, а не другие бандлеры? Webpack отличается подробной документацией и активным коммьюнити. Кроме этого, он имеет ряд преимуществ по сравнению с аналогами.
🌐Подробнее
Made in HTML/CSS
👍6
Это один из самых известных JavaScript-трюков, но повторить его не помешает.
Чтобы удалить несколько значений из конца массива, необязательно пользоваться методами slice(), splice() или pop(). Просто переопределите свойство length.
Это работает только с массивами, а вот с Set, например, трюк не пройдет.
Made in HTML/CSS
Чтобы удалить несколько значений из конца массива, необязательно пользоваться методами slice(), splice() или pop(). Просто переопределите свойство length.
Это работает только с массивами, а вот с Set, например, трюк не пройдет.
Made in HTML/CSS
👍7🔥1👨💻1
Современные тренды CSS
Темы, которые разбираются в этой статье:
- attr()
- toggle()
- sibling-count(), sibling-index()
- first-valid()
- -*mix, -*progress
- calc-size()
- random(), random-item()
🌐 Читать статью
Made in HTML/CSS
Темы, которые разбираются в этой статье:
- attr()
- toggle()
- sibling-count(), sibling-index()
- first-valid()
- -*mix, -*progress
- calc-size()
- random(), random-item()
🌐 Читать статью
Made in HTML/CSS
👍6
Что представляет собой объединение ресурсов и почему оно важно?
Объединение ресурсов или Asset bundling собирает CSS, JavaScript и другие ресурсы в один или несколько минимизированных файлов. Этот процесс сокращает количество HTTP-запросов, снижает время загрузки и повышает производительность. Он также помогает в управлении кешем и упорядочивании кода.
Made in HTML/CSS
Объединение ресурсов или Asset bundling собирает CSS, JavaScript и другие ресурсы в один или несколько минимизированных файлов. Этот процесс сокращает количество HTTP-запросов, снижает время загрузки и повышает производительность. Он также помогает в управлении кешем и упорядочивании кода.
Made in HTML/CSS
👍4🔥1
Прогрессивные веб-приложения, по всей видимости, будут становиться всё популярнее и распространённее. Они нацелены на то, чтобы пользователь воспринимал их не как обычные веб-страницы, а как нечто вроде классических настольных приложений, которые нормально работают независимо от того, подключен компьютер к интернету или нет.
Отсюда исходит одно из основных требований к прогрессивным веб-приложениям, которое заключается в их надёжном функционировании при отсутствующем или нестабильном сетевом соединении. Сервис-воркеры являются важной технической деталью реализации подобного поведения приложений.
Made in HTML/CSS
Отсюда исходит одно из основных требований к прогрессивным веб-приложениям, которое заключается в их надёжном функционировании при отсутствующем или нестабильном сетевом соединении. Сервис-воркеры являются важной технической деталью реализации подобного поведения приложений.
Made in HTML/CSS
👍4🔥2
Методы some() и every() в JavaScript предоставляют удобный способ проверки элементов массива на соответствие заданному условию. Эти методы делают код более читабельным и лаконичным по сравнению с использованием циклов.
Made in HTML/CSS
Made in HTML/CSS
👍5🔥3
Owloops — это инструмент с открытым исходным кодом для мониторинга работоспособности и производительности веб-сайтов через командную строку.
Он позволяет в реальном времени отслеживать ключевые метрики, такие как доступность сайта, время отклика сервера, состояние SSL-сертификатов и их срок действия. Помимо сбора данных, инструмент также поддерживает функцию оповещений, чтобы своевременно уведомлять о возможных проблемах.
Made in HTML/CSS
Он позволяет в реальном времени отслеживать ключевые метрики, такие как доступность сайта, время отклика сервера, состояние SSL-сертификатов и их срок действия. Помимо сбора данных, инструмент также поддерживает функцию оповещений, чтобы своевременно уведомлять о возможных проблемах.
Made in HTML/CSS
👍6
Как решить проблему совместимости с браузерами?
Потребуется:
- Использовать функции обнаружения с помощью Modernizr, чтобы обеспечить резервирование или полифилы для неподдерживаемых функций.
- Применить техники прогрессивного улучшения и плавного ухудшения.
- Использовать CSS reset или normalize.css для поддержания согласованности стилей в различных браузерах.
- Протестировать приложение в браузерах и на различных устройствах
Made in HTML/CSS
Потребуется:
- Использовать функции обнаружения с помощью Modernizr, чтобы обеспечить резервирование или полифилы для неподдерживаемых функций.
- Применить техники прогрессивного улучшения и плавного ухудшения.
- Использовать CSS reset или normalize.css для поддержания согласованности стилей в различных браузерах.
- Протестировать приложение в браузерах и на различных устройствах
Made in HTML/CSS
👍5
Подобно тому, как микросервисы разбивают бэкенд-монолиты на слабо связанные сервисы, микрофронтенды разбивают большое веб-приложение на более мелкие независимые части, которые работают вместе без сбоев, образуя целое приложение.
С помощью микрофронтендов каждая часть пользовательского интерфейса (UI) может разрабатываться и поддерживаться отдельно. Команды могут работать автономно, что обеспечивает более быстрые релизы, лучшую масштабируемость и повышенную производительность.
🌐 Подробнее
Made in HTML/CSS
С помощью микрофронтендов каждая часть пользовательского интерфейса (UI) может разрабатываться и поддерживаться отдельно. Команды могут работать автономно, что обеспечивает более быстрые релизы, лучшую масштабируемость и повышенную производительность.
🌐 Подробнее
Made in HTML/CSS
🔥5👍1
Методы find() и findIndex() в JavaScript предоставляют удобный способ поиска элементов в массиве на основе заданного условия. Эти методы упрощают код, делая его более читабельным и лаконичным по сравнению с использованием циклов.
Made in HTML/CSS
Made in HTML/CSS
👍8🔥3
Forwarded from Jelatin
Selectext — это инструмент, который помогает упростить работу с выделенным текстом на веб-страницах и видео. Она предоставляет удобный интерфейс для получения, обработки и управления текстом, который пользователь выделяет на странице.
Made in HTML/CSS
Made in HTML/CSS
👍4🔥3
В чем преимущества использования пре- и постпроцессоров CSS?
Использование пре- и постпроцессоров вместе позволяет создавать более поддерживаемый, масштабируемый и эффективный CSS-код, экономя время и усилия разработчиков.
Преимущества препроцессоров CSS (например, Sass, Less, Stylus): расширяют CSS такими функциями, как переменные, миксины и вложенные правила, делая его более удобным в использовании и менее повторяющимся.
Преимущества постпроцессоров CSS (например, PostCSS, Autoprefixer): помогают работать с префиксами поставщиков, добавляют полифилы и оптимизируют CSS для повышения производительности.
Made in HTML/CSS
Использование пре- и постпроцессоров вместе позволяет создавать более поддерживаемый, масштабируемый и эффективный CSS-код, экономя время и усилия разработчиков.
Преимущества препроцессоров CSS (например, Sass, Less, Stylus): расширяют CSS такими функциями, как переменные, миксины и вложенные правила, делая его более удобным в использовании и менее повторяющимся.
Преимущества постпроцессоров CSS (например, PostCSS, Autoprefixer): помогают работать с префиксами поставщиков, добавляют полифилы и оптимизируют CSS для повышения производительности.
Made in HTML/CSS
👍5🔥1
Метод Object.assign() в JavaScript используется для копирования значений всех собственных перечисляемых свойств из одного или более исходных объектов в целевой объект.
Это позволяет легко клонировать объекты или объединять несколько объектов в один.
Made in HTML/CSS
Это позволяет легко клонировать объекты или объединять несколько объектов в один.
Made in HTML/CSS
🔥6👍1
Самые частые ошибки в HTML-вёрстке
Статья посвящена частым ошибкам в HTML-вёрстке. Рассматриваются типичные проблемы, которые могут быть как очевидными (например, неправильное отображение текста), так и скрытыми (например, несовместимость с браузерами, снижение скорости загрузки или уязвимости в коде).
🌐 Читать статью
Made in HTML/CSS
Это случается и с новичками, и с сеньорами
Статья посвящена частым ошибкам в HTML-вёрстке. Рассматриваются типичные проблемы, которые могут быть как очевидными (например, неправильное отображение текста), так и скрытыми (например, несовместимость с браузерами, снижение скорости загрузки или уязвимости в коде).
🌐 Читать статью
Made in HTML/CSS
🔥5👍3
Как определить текущее местоположение пользователя на сайте?
В статье рассматривается задача определения текущего местоположения пользователя на сайте с использованием JavaScript. Автор делится своим опытом реализации функционала для получения города (или другой локации) через геоданные и сторонние сервисы.
🌐 Читать статью
Made in HTML/CSS
В статье рассматривается задача определения текущего местоположения пользователя на сайте с использованием JavaScript. Автор делится своим опытом реализации функционала для получения города (или другой локации) через геоданные и сторонние сервисы.
🌐 Читать статью
Made in HTML/CSS
👍7🔥1
Значения по умолчанию при деструктурировании в JavaScript позволяют устанавливать резервные значения для свойств объектов, которые могут отсутствовать.
Это делает код более надежным и устраняет необходимость в явных проверках на наличие свойств.
Made in HTML/CSS
Это делает код более надежным и устраняет необходимость в явных проверках на наличие свойств.
Made in HTML/CSS
👍7🔥1
Деструктурирование параметров функции в JavaScript позволяет извлекать свойства объектов или элементы массивов непосредственно в сигнатуре функции.
Это делает код более лаконичным и улучшает его читабельность, избавляя от необходимости явно извлекать значения внутри тела функции.
Made in HTML/CSS
Это делает код более лаконичным и улучшает его читабельность, избавляя от необходимости явно извлекать значения внутри тела функции.
Made in HTML/CSS
🔥6👍3
🖥 Никакой скучной теории, только интересные практические уроки по вёрстке на HTML и CSS
➡️ @html_css_praktika
➡️ @html_css_praktika
👍6🔥3
Autoprefixer — это инструмент (плагин PostCSS), который автоматически добавляет вендорные префиксы к CSS-свойствам, чтобы обеспечить поддержку различных браузеров. Это помогает разработчикам писать чистый и современный CSS без необходимости заботиться о совместимости с различными браузерами.
Made in HTML/CSS
Made in HTML/CSS
👍9🔥2
Shortcuts.design — это отличный ресурс для веб-дизайнеров, разработчиков и всех, кто интересуется пользовательским опытом (UX) и интерфейсами. Этот сайт предоставляет удобную подборку горячих клавиш (shortcuts) для различных популярных программ, сервисов и инструментов, которые используются в процессе работы с дизайном, разработкой и другими задачами.
Made in HTML/CSS
Made in HTML/CSS
👍3🔥3