Мониторинг Linux сервера с Prometheus Node Exporter

2 года назад·2 мин. на чтение

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

В этой статье установим и настроим Node exporter. Это второй шаг настройки сбора и отображения метрик. Метрики будем собирать на сервере Ubuntu, а Grafana, для экономии ресурсов на сервере, установим на локальном компьютере. Весь процесс можно разделить на три части:
  1. Установка Prometheus
  2. Установка Node exporter (рассмотрим в этой статье)
  3. Установка Grafana
Prometheus получает метрики из разных сервисов и собирает их в одном месте. В нашем случае Prometheus будет собирать данные из экземпляра Node Exporter. Node exporter собирает метрики операционной системы и через HTTP предоставляет к ним доступ. Grafana отображает данные, полученные из Prometheus. Эти данные можно отобразить в виде диаграмм и графиков, объединив в дашборды.

Установка Node Exporter

Для установки Node Exporter выясним свежую версию Node Exporter на github и скопируем адрес ссылки на выбранную версию. В нашем случае это https://github.com/prometheus/node_exporter/releases/download/v1.4.0/node_exporter-1.4.0.linux-386.tar.gz. Скачать архив, распаковать и переименовать папку.
wget https://github.com/prometheus/node_exporter/releases/download/v1.4.0/node_exporter-1.4.0.linux-386.tar.gz
tar -xvf node_exporter-1.4.0.linux-386.tar.gz
Переместить бинарные файлы Node Exporter в /usr/local/bin.
sudo mv node_exporter-1.4.0.linux-386/node_exporter /usr/local/bin/

Запуск службы Node Exporter

Создать пользователя node_exporter для запуска службы Node Exporter.
sudo useradd -rs /bin/false node_exporter
Создать файл node_exporter.service для службы node_exporter.
sudo vi /etc/systemd/system/node_exporter.service
Добавить в файл node_exporter.service следующее содержимое.
[Unit]
Description=Node Exporter
After=network.target

[Service]
User=node_exporter
Group=node_exporter
Type=simple
ExecStart=/usr/local/bin/node_exporter

[Install]
WantedBy=multi-user.target    
Перезапустить службу systemd для регистрации службы node_exporter и запустить службу node_exporter.
sudo systemctl daemon-reload
sudo systemctl start node_exporter
Проверить статус службы node_exporter.
sudo systemctl status node_exporter
Запустить службу при запуске системы.
sudo systemctl enable node_exporter
Теперь Node exporter будет экспортировать метрики по адресу
http://localhost:9100/metrics
Теперь нужно отредактировать файл /etc/prometheus/prometheus.yml, добавив новый job_name в scrape_configs с этим адресом.
- job_name: 'node_exporter_metrics'
  scrape_interval: 10s
  static_configs:
    - targets: ['localhost:9100']
Перезапустить службу prometheus для того, чтобы изменения вступили в силу.
sudo systemctl restart prometheus
Теперь, если перейти по адресу http://localhost:9090/targets, то можно увидеть следующий статус. Интрерфейс Prometheus На следующем шаге установим Grafana.

Хуки useTransition и useDeferredValue в ReactJS 18

2 года назад·3 мин. на чтение

В React 18, релиз которого произошел в марте 2022, появилось много новых инструментов для написания производительных и отзывчивых приложений. Одним из заметных изменений является механизм рендеринга с новой ключевой концепцией: конкурентный рендеринг (concurrent rendering).

В этой статье повнимательнее рассмотрим два новых хука: useTransition() и useDeferredValue(). Эти два хука дают возможность определять приоритет обновления состояния, или, скорее, указывать, является ли обновление менее важным, чем другие, и откладывать его в пользу более срочных.
Какое обновление можно считать срочным, а какое обычным?
  • Срочные обновления: отражают прямое взаимодействие, такое как набор текста, клики, нажатия и т. д., т.е. то с чем взаимодействует пользователь. Когда вы вводите текст в поле ввода, вы хотите сразу увидеть введенный вами текст. В противном случае UI будет казаться медленным и подлагивать. Поэтому мы хотим сделать такие обновления приоритетным.
  • Обычные обновления: переход пользовательского интерфейса из одного вида в другой. Пользователи знают, что представление должно измениться или обновиться (например, когда ожидается ответ на запрос данных). Даже если есть небольшая задержка, это можно рассматривать как ожидаемое поведение, и это не будет восприниматься как медлительность приложения.
Итак, теперь подробнее рассмотрим эти два новых хука, объясним, когда их можно использовать, и посмотрим на конкретные примеры того, как их реализовать.

Хук useTransition() и функция startTransition()

До React 18 все обновления состояния помечались как "срочные". Это означает, что все обновления состояния обрабатывались одинаково с одинаковым приоритетом. С помощью useTransition() теперь можно пометить некоторые обновления состояния как несрочные.

Когда использовать useTransition() ?

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

Как использовать useTransition() ?

function App() {
 const [isPending, startTransition] = useTransition();
 const [searchQuery, setSearchQuery] = useState('');
 
 // запрос данных, который занимает некоторое время
 const filteredResults = getProducts(searchQuery);
 
 function handleQueryChange(event) {
   startTransition(() => {
     // оборачивая setSearchQuery() в startTransition(),
     // мы помечаем эти обновления как менее важные
     setSearchQuery(event.target.value);
   });
 }
 
 return (
   <div>
     <input type="text" onChange={handleQueryChange} />
 
     {isPending && <span>Loading...</span>}
     <ProductsList results={filteredResults} />
   </div>
 );
}

Хук useDeferredValue()

useDeferredValue() очень похож на useTransition() в том, что он позволяет отложить несрочное обновление состояния, но применяется его к части дерева. Это похоже методы debounce и throttle, которые мы часто используем для отложенных обновлений. React будет работать с такими обновлениями, как только завершатся срочные обновления.

Когда использовать useDeferredValue()?

С помощью useTransition() вы сами решаете, когда конкретное обновление состояния может быть помечено как менее срочное. Но иногда такой возможности может и не быть, например, если фрагмент кода находится в сторонней библиотеке. В таких случаях можно воспользоваться хуком useDeferredValue(). С помощью useDeferredValue() вы можете обернуть значение и пометить его изменения как менее важные и, следовательно, отложить повторный рендеринг. useDeferredValue() будет возвращать предыдущее значение до тех пор, пока есть более срочные обновления для завершения и отображения дерева с обновленным значением.

Как использовать useDeferredValue() ?

function ProductsList({ results }) {
 // deferredResults получат обновленные данные
 // когда завершатся срочные обновления
 const deferredResults = useDeferredValue(results);
 
 return (
   <ul>
     {deferredResults.map((product) => (
       <li key={product.id}>{product.title}</li>
     ))}
   </ul>
 );
}

Итоги

Эти два новых хука позволяют сделать интерфейсы максимально отзывчивыми, даже в сложных приложениях с большим количеством повторных рендерингов, отдавая приоритет обновлениям, которые имеют решающее значение для взаимодействия с пользователем, и помечая некоторые другие как менее важные. Это не означает, что нужно оборачивать все состояния этими хуками. Их следует использовать в крайнем случае, если приложение или компоненты не могут быть оптимизированы другими способами (например, при помощи lazy loading’а, пагинации, веб-воркеров и т. д.).