Датацентры всего мира производят 3.7% мирового CO2 (carbon footprint, углекислый газ)
Каждый показ вашего сайта является причиной выделения CO2 - в среднем 0.8 грамм.
Замерьте карбоновый след вашего сайта
Еще одна причина писать эффективные
#pwa #optimization
Каждый показ вашего сайта является причиной выделения CO2 - в среднем 0.8 грамм.
Замерьте карбоновый след вашего сайта
Еще одна причина писать эффективные
PWA
#pwa #optimization
Website Carbon Calculator
Website Carbon Calculator v3 | What's your site's carbon footprint?
The original website carbon calculator tool, brought to you by Wholegrain Digital,London's original sustainable WordPress agency.
Жила-была мышка в домике.
Скачет мимо лягушка - прыг-прыг! - спрашивает:
- Кто, кто в домике живет?
- Мышка - джейквишка. А ты кто?
- А я лягушка - реактушка. Пусти и меня!
- Иди.
Вот их уже двое. Бежит зайчик. Подбежал к домику, спрашивает:
- Кто, кто в домике живет?
- Мышка - джейквишка, лягушка - реактушка. А ты кто?
- А я зайчик - ангулярчик. Пустите и меня!
- Иди.
Вот их уже трое. Бежит лисичка:
- Кто, кто в домике живет?
- Мышка - джейквишка, лягушка - реактушка да зайчик - ангулярчик. А ты кто?
-А я лисичка - астричка. Пустите и меня!
Вот их уже четверо сидит. Глядь, бежит волчок - и тоже к домику, да и спрашивает:
- Кто, кто в домике живет?
- Мышка - джейквишка, лягушка - реактушка, зайчик - ангулярчик да лисичка - астричка. А ты кто?
- А я волчара - вьючара. Пустите и меня!
- Ну иди!
Влез и этот. Уже стало их пятеро. Откуда ни возьмись, бредет кабан:
- Хро-хро-хро, кто в домике живет?
- Мышка - джейквишка, лягушка - реактушка, зайчик - ангулярчик, лисичка - астричка да волчара - вьючара. А ты кто?
- А я кабан - хатамахан. Пустите и меня!
Вот беда, всем в домик охота.
- Тебе и не влезть!
- Как-нибудь влезу, пустите!
- Ну, что ж с тобой поделаешь, лезь!
Влез и этот. Уже их шестеро. И так им тесно, что не повернуться! А тут затрещали сучья: вылезает медведь и тоже к домику подходит, ревет:
- Кто, кто в домике живет?
- Мышка - джейквишка, лягушка - реактушка, зайчик - ангулярчик, лисичка - астричка, волчара - вьючара да кабан - хатамахан. А ты кто?
- Гу-гу-гу, вас тут многовато! А я медведюшка - денофрюшка. Пустите и меня!
- Как же мы тебя пустим? Ведь и так тесно.
- Да как-нибудь!
- Ну уж иди, только с краешку!
Влез и этот. Семеро стало, да так тесно, что домик того и гляди, разорвется.
А тем временем шёл Деми Мурыч по лесу. Смотрит - домик битком набитый.
- Вы кто? - спрашивает.
- Мы? Фронтендеры!!
- Идите в жопу, фронтендеры, - сказал Деми Мурыч и пошёл дальше.
#creative #literature #humor
Скачет мимо лягушка - прыг-прыг! - спрашивает:
- Кто, кто в домике живет?
- Мышка - джейквишка. А ты кто?
- А я лягушка - реактушка. Пусти и меня!
- Иди.
Вот их уже двое. Бежит зайчик. Подбежал к домику, спрашивает:
- Кто, кто в домике живет?
- Мышка - джейквишка, лягушка - реактушка. А ты кто?
- А я зайчик - ангулярчик. Пустите и меня!
- Иди.
Вот их уже трое. Бежит лисичка:
- Кто, кто в домике живет?
- Мышка - джейквишка, лягушка - реактушка да зайчик - ангулярчик. А ты кто?
-А я лисичка - астричка. Пустите и меня!
Вот их уже четверо сидит. Глядь, бежит волчок - и тоже к домику, да и спрашивает:
- Кто, кто в домике живет?
- Мышка - джейквишка, лягушка - реактушка, зайчик - ангулярчик да лисичка - астричка. А ты кто?
- А я волчара - вьючара. Пустите и меня!
- Ну иди!
Влез и этот. Уже стало их пятеро. Откуда ни возьмись, бредет кабан:
- Хро-хро-хро, кто в домике живет?
- Мышка - джейквишка, лягушка - реактушка, зайчик - ангулярчик, лисичка - астричка да волчара - вьючара. А ты кто?
- А я кабан - хатамахан. Пустите и меня!
Вот беда, всем в домик охота.
- Тебе и не влезть!
- Как-нибудь влезу, пустите!
- Ну, что ж с тобой поделаешь, лезь!
Влез и этот. Уже их шестеро. И так им тесно, что не повернуться! А тут затрещали сучья: вылезает медведь и тоже к домику подходит, ревет:
- Кто, кто в домике живет?
- Мышка - джейквишка, лягушка - реактушка, зайчик - ангулярчик, лисичка - астричка, волчара - вьючара да кабан - хатамахан. А ты кто?
- Гу-гу-гу, вас тут многовато! А я медведюшка - денофрюшка. Пустите и меня!
- Как же мы тебя пустим? Ведь и так тесно.
- Да как-нибудь!
- Ну уж иди, только с краешку!
Влез и этот. Семеро стало, да так тесно, что домик того и гляди, разорвется.
А тем временем шёл Деми Мурыч по лесу. Смотрит - домик битком набитый.
- Вы кто? - спрашивает.
- Мы? Фронтендеры!!
- Идите в жопу, фронтендеры, - сказал Деми Мурыч и пошёл дальше.
#creative #literature #humor
Если показываете через
Через
Через хук роутера
Второй способ дает еще возможность использовать
#router #tip
<router-view>
страницу с route
параметром (продукты, каталоги, пользователей через id
), и надо при смене параметра загружать нового, - то есть, следить за изменением параметра, то делать это можно двумя способами.Через
watch
:watch(
() => props.id,
async () => {
userData.value = await fetchUser(to.params.id);
},
{ immediate: true }
);
Через хук роутера
onBeforeRouteUpdate
:js
import { onBeforeRouteUpdate } from 'vue-router'
onBeforeRouteUpdate(async (to, from) => {
if (to.params.id !== from.params.id) {
userData.value = await fetchUser(to.params.id);
}
})
Второй способ дает еще возможность использовать
onBeforeRouteLeave
, если вдруг надо#router #tip
Написал статью "Обзор различных методов работы с реактивным стейтом во Vue"
Переделанная вот эта. Исправлены фундаментальные ошибки (автор не понимает, что такое
Внизу статьи опрос, просьба проголосовать.
Также размещено на Vue-FAQ
#reactivity #pinia #eventbus #article
Переделанная вот эта. Исправлены фундаментальные ошибки (автор не понимает, что такое
composable
функция) и некоторые другие недочетыВнизу статьи опрос, просьба проголосовать.
Также размещено на Vue-FAQ
#reactivity #pinia #eventbus #article
Хабр
Обзор различных методов работы с реактивным стейтом во Vue
Организовать обмен [реактивными] данными между компонентами и модулями во Vue 3 приложении можно несколькими способами. 1. Prop drilling Prop drilling - это ситуация, когда пропсы передаются через...
Потестируйте и покритикуйте (UX, UI, функционал и др.) последний пет-проект
lissa-health.com
Позволяет держать в одном месте свою медицинскую информацию (лабораторные анализы, заключения, произвольные записи) и делать AI аналитику по ним
На сайте есть демо-видео
Также можно загрузить демо-данные
#lissa #pet
lissa-health.com
Позволяет держать в одном месте свою медицинскую информацию (лабораторные анализы, заключения, произвольные записи) и делать AI аналитику по ним
На сайте есть демо-видео
Также можно загрузить демо-данные
#lissa #pet
Lissa-Health
Lissa Health
Lissa Health | Персональный помощник в области здоровья
Технические детали проекта выше
Для графика (
Используются разные
Кнопка справа внизу (
Её задача - сделать удобный
#lissa #pet #arkui
ark-ui
в некоторых местах глючит, но как UI
библиотека понравилась, буду использовать.Для графика (
chart
) модели из TS
переделал на классы (без реактивности внутри), стало намного удобнейAI
очень помогает делать перевод сайта сразу на нескольких языках одновременно с кодингомИспользуются разные
LLM
для парсинга файлов и аналитических отчетов (подешевле и подороже)Кнопка справа внизу (
FAB
) идет как волшебная палочка - в ней разные действия в зависимости от страницы и контекста.Её задача - сделать удобный
UX
, чтобы пользователь не бегал по всему экрану пальцемPWA
, variable fonts
, JSON-RPC
, JSON5
#lissa #pet #arkui
Если вы используете
Можно сделать следующий финт:
меняете на
Ушедшие в первые 3 секунды посетители считаться не будут, но они, обычно, и не нужны.
#google #seo
Google Analytics
то Google Pagespeed
часто ругается сам на себя - gtag.js
размером в 100Кб+ снижает показатели сайта. Можно сделать следующий финт:
<script async src="https://www.googletagmanager.com/gtag/js?id=G-0SGZMMY7Y4"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-0SGZMMY7Y4');
</script>
меняете на
<script>
window.addEventListener('load', function() {
setTimeout(() => {
var script = document.createElement('script');
script.src = 'https://www.googletagmanager.com/gtag/js?id=G-0SGZMMY7Y4';
script.async = true;
document.head.appendChild(script);
window.dataLayer = window.dataLayer || [];
function gtag(){ dataLayer.push(arguments); }
gtag('js', new Date());
gtag('config', 'G-0SGZMMY7Y4');
}, 3000);
});
</script>
});
Ушедшие в первые 3 секунды посетители считаться не будут, но они, обычно, и не нужны.
#google #seo
Media is too big
VIEW IN TELEGRAM
Пятничный оффтоп
Новые власти США рассекречивают документы вивесектария предыдущих правителей
Байденовская администрация в рамках DEI потратила $10 миллионов на создание и изучение трансгендерных мышей, крыс и обезьянок
В частности, $2.5 миллиона ушли на попытки забеременить трансгендерных мышей (отрезав им предварительно гениталии, что-то пересадив и накачав гормонами)
Содом и Гоморра. Помянем бедных испытуемых...
#offtop #pets
Новые власти США рассекречивают документы вивесектария предыдущих правителей
Байденовская администрация в рамках DEI потратила $10 миллионов на создание и изучение трансгендерных мышей, крыс и обезьянок
В частности, $2.5 миллиона ушли на попытки забеременить трансгендерных мышей (отрезав им предварительно гениталии, что-то пересадив и накачав гормонами)
Содом и Гоморра. Помянем бедных испытуемых...
#offtop #pets
Если делаете два близких приложения (например, клиентский фронтенд и админку) , и хотите расшарить какие-то компоненты и ресурсы, то есть несколько вариантов
1. Монорепозиторий. Оба проекта идут как пакеты и общие пакеты тоже отдельно. На любителя.
2. Выделить общее в отдельный
3. Делать в одном проекте, настроить на две точки входа. Собирать
4. Два отдельных
4.
#tip
1. Монорепозиторий. Оба проекта идут как пакеты и общие пакеты тоже отдельно. На любителя.
2. Выделить общее в отдельный
NPM
пакет и подключать его. Неудобно возиться с версиями и апдейтом.3. Делать в одном проекте, настроить на две точки входа. Собирать
Vite
будет в одну кучу с двумя html
файлами входа. Подразумевается, что так удобно работать на одном сайте с двумя мини-приложениями4. Два отдельных
vite.config.ts
файла, два html, два App.vue и роутера. В package.json
в скриптах прописываете свой Vite
конфиг и копирование своего html в index.html
. Запускается и собирается каждый как отдельный проект, в коде всё общее.4.
Git submodules
. Отдельный проект подключается как поддиректория в твой (общие компоненты).#tip
Написал статью про Model Context Protocol
Грубо говоря, это попытка выработать стандартный
На двух последних проектах окунулся в работу с
#ai #article
Грубо говоря, это попытка выработать стандартный
API
для соединения LLM
и инструментов - любых приложений, делающих что-то специфичное.На двух последних проектах окунулся в работу с
AI
и эта штука (MCP
) очень сильно может помочь в разработке приложений, использующих LLM
. Чтобы не выклянчивать у чатбота что-то в диалоге, а использовать его для управления специализированными инструментами и получать на порядок более качественный результат.#ai #article
Хабр
Model Context Protocol (MCP): Стандартизация взаимодействия AI-приложений
Где-то летом 2024 года в некоторых OpenAI сервисах появилась возможность использовать "инструменты". Инструмент — это функция, которая выполняется на сервере и возвращает некий результат. Например, в...