Вот как я уменьшил углеродный след brockherion.dev, и как вы также уменьшите след своего сайта.

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

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

Тестирование выбросов CO2 для версии brockherion.dev для Next.js

Сначала я протестировал версию brockherion.dev для Next.js. Я понятия не имел, чего от него ожидать. Я знал, что вход на мой сайт был быстрым и получил хорошие оценки на Lighthouse. Я думал, что углеродный след brockherion.dev будет не так уж велик.

Результаты оказались не такими, как я ожидал. Каждый посетитель версии brockherion.dev для Next.js будет генерировать около 0,69 г CO2 за посещение. Это грязнее, чем 64% сайтов, протестированных на Website Carbon Calculator!

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

Повторное тестирование версии brockherion.dev Astro

Недавно я перенес brockherion.dev с Next.js на Astro. В целом, мой опыт работы с Astro был положительным. Это решило некоторые проблемы, которые у меня были с Next.js и созданием в нем статических сайтов.

Я перезапустил калькулятор углерода на веб-сайте, на этот раз с версией Astro. В очередной раз результаты меня очень удивили. Астро-версия сайта brockherion.dev генерирует около 0,07 г CO2 за одно посещение, что означает сокращение выбросов примерно на 90%. Эта версия чище, чем 94% протестированных сайтов. Это безумное улучшение!

С моей стороны было бы преуменьшением сказать, что я был в восторге от этих результатов. Но я начал задаваться вопросом, почему это так. Если вы читали мою статью о том, как я пересобрал brockherion.dev в Astro, я рассказываю о том, что это был в основном порт 1–1. Это потому, что содержание осталось прежним, но макет был несколько изменен. Некоторые другие вещи, которые я делал, вращались вокруг оптимизации изображений. Эти небольшие изменения были в основном сделаны для того, чтобы максимизировать производительность версии Astro.

Я начал думать о том, почему версия Astro производила гораздо меньше CO2, чем версия Next. Хотя настройки, которые я внес в изображения, безусловно, помогли, оба сайта были относительно одинаковой структурой и размещены на Vercel. Я думал, что, возможно, Vercel не самый чистый провайдер, но результаты версии Astro показали, что это не так.

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

Так что улучшение выбросов углерода сводится к размеру пакета. Пакеты Next намного больше, чем Astro. Для загрузки версии Next.js требуется больше энергии, что приводит к увеличению выбросов CO2 на одного посетителя.

Заключительные мысли

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

Трудно понять, где и как вы можете изменить ситуацию. Я перерабатываю все, что могу, выключаю свет, когда он не используется, и не езжу без необходимости. Это все мелочи, которые я могу сделать, чтобы уменьшить свой углеродный след. И теперь у меня есть еще один способ, которым я могу еще больше сократить свое присутствие в своей работе. Разработчики находятся в уникальном положении, когда мы можем создать что угодно из ничего. С помощью компьютера мы можем оказывать невероятное влияние на окружающих нас людей. Почему бы не оказать положительное влияние и на окружающую среду?

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

Удачного кодирования!