Обнаружение изменения предпочтений системной темы с помощью JavaScript

Создание отказоустойчивых систем на AWS : узнайте, как спроектировать и внедрить отказоустойчивую отказоустойчивую инфраструктуру с высокой доступностью на AWS.

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

Чтобы обнаружить изменение предпочтения системной темы с помощью JavaScript, вам необходимо объединить matchMedia , Preferences-Color-Scheme и прослушиватель событий:

window.matchMedia('(предпочитает цветовую схему: темный)')
      .addEventListener('изменение',({ совпадения }) => {
  если (совпадает) {
    console. log("перейти в темный режим!")
  } еще {
    console.log("Перейти в легкий режим!")
  }
})
 

Событие change API matchMedia уведомляет вас об изменении системных настроек. Вы можете использовать это событие для автоматического обновления отображения сайта в режиме реального времени.

Мне нравится, что этот API позволяет определять предпочтения пользователя на системном уровне. Удовлетворение потребностей пользователей является важной частью создания отличного веб-сайта!

  • Дэвид Уолш

    Vibration API

    Многие из новых API-интерфейсов, предоставляемых нам поставщиками браузеров, больше ориентированы на мобильных пользователей, чем на пользователей настольных компьютеров. Один из таких простых API — Vibration API. Vibration API позволяет разработчикам управлять вибрацией устройства с помощью JavaScript…

  • Автор: Дэвид Уолш

    Создание CSS-анимации перелистывания

    CSS-анимация — это очень весело; Прелесть их в том, что с помощью множества простых свойств вы можете создать что угодно, от элегантного постепенного появления до эффекта WTF-Pixar-будет-гордиться. Один CSS-эффект где-то посередине — это CSS-флип-эффект, посредством которого…

  • Дэвид Уолш0034

    Изображения сигналов — прекрасное дополнение к скучным аудио-виджетам. Они могут быть как функциональными, так и эстетически привлекательными, позволяя пользователям визуально ориентироваться в аудио. Недавно я нашел wavesurfer.

    js, потрясающую утилиту для обработки изображений сигналов, которая использует API веб-аудио для создания супернастраиваемых…

  • Автор: Соледад Пенадес .meatspac.es!

    Моя напарница Эдна Пиранья не только классный хакер; она также фантастический философ! Общение и онлайн-взаимодействия — тема, которая долгое время занимала ее мысли, а также привела к появлению множества интересных экспериментальных проектов…

«Мы действительно ожидаем скептицизма» — журнал Visual Studio

Новости

Microsoft предлагает большое изменение JavaScript: «Мы действительно ожидаем скептицизма»

Microsoft объявила об амбициозном проекте по внедрению синтаксиса типов в ECMAScript, официальный стандарт JavaScript.

Хотя это может звучать ужасно похоже на TypeScript, это другое.

Компания поддерживает и сотрудничает с первоначальным предложением этапа 0 по добавлению необязательного и стираемого синтаксиса типов в JavaScript под названием «Предложение ECMAScript: типы как комментарии».

Он гласит:

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

Цель этого предложения — дать разработчикам возможность запускать программы, написанные на TypeScript, Flow и других надмножествах JavaScript со статической типизацией, без какой-либо необходимости транспиляции, если они придерживаются определенного достаточно большого подмножества языка.

Даниэль Розенвассер из Microsoft, старший программный менеджер TypeScript, 9 марта написал подробный пост в блоге, объясняющий предложение, на разработку которого могут уйти годы, если оно будет реализовано.

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

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

«Идея этого предложения заключается в том, что JavaScript мог бы создать набор синтаксиса для типов, которые движки полностью игнорировали бы

, но которые могли бы использовать такие инструменты, как TypeScript, Flow и другие», — сказал он. «Это позволяет нам сохранить то, что вам нравится в TypeScript — проверку типов и редактирование — и в то же время устранить необходимость в этапе сборки в процессе разработки».

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

[Щелкните изображение, чтобы увеличить его.] Быстрее и проще (источник: Microsoft).

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

  • введите аннотации к переменным и функциям
  • (опционально) модификаторы ( ? ) для параметров и членов класса
  • объявления типов ( интерфейсы и
    псевдонимы типа
    )
  • Операторы утверждения типа
  • ( как и ! )

В то время как другие конструкции, такие как модификаторы видимости, например, public , private и protected , также могут быть в области действия, другие, такие как перечисления, пространства имен и свойства параметров, будут вне области действия, поскольку они имеют наблюдаемое поведение во время выполнения.

«Эти функции могут быть предложены как отдельные функции ECMAScript на основе отзывов, но наша текущая цель — поддерживать некоторое большое подмножество TypeScript, которое, по нашему мнению, могло бы стать ценным дополнением к JavaScript», — сказал он.

Предложение будет представлено на предстоящем в марте 2022 года пленарном заседании группы TC39 («Спецификация JavaScript»), состоящей из разработчиков JavaScript, реализаторов, ученых и других лиц, которые сотрудничают с сообществом для поддержки и развития определения JavaScript, надеясь перейти со стадии 0 до стадии 1.

«Достижение стадии 1 будет означать, что комитет по стандартам считает, что поддержку синтаксиса типов стоит рассмотреть для ECMAScript», — сказал Розенвассер. «Это не беспроигрышный вариант — в комитете есть много ценных точек зрения, и мы ожидаем некоторой доли скептицизма. Подобное предложение получит много отзывов и должное внимание. Оно может включать множество изменений в дизайне.

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

«Но если мы все это проделаем, у нас появится шанс внести одно из самых значительных улучшений в мир JavaScript. Мы в восторге от этого и надеемся, что вы тоже».


Об авторе

Дэвид Рамел — редактор и писатель Converge360.

Включите JavaScript для просмотра комментариев на основе Disqus.comments на основе Disqus

  • Практические занятия с профилями: «Одна из самых востребованных функций VS Code за все время»

    Объявив о последнем обновлении Visual Studio Code на прошлой неделе, Microsoft заявила, что новые функции профилей были одной из самых востребованных функций Visual Studio Code за все время, что позволяет создавать уникальные конфигурации для различных проектов и рабочих областей.

  • ChatGPT в предварительной версии в службе Azure OpenAI

    ChatGPT, самая популярная технология в отрасли, теперь доступна в службе Azure OpenAI в качестве предварительной версии, сообщила Microsoft сегодня, 9 марта.

  • 10 лучших расширений AI для Visual Studio, код

    Благодаря новым генеративным инструментам искусственного интеллекта, которые встряхивают пространство разработки программного обеспечения, теперь в Visual Studio Code Marketplace представлено более 400 дополнений с искусственным интеллектом.