Поскольку все вечнозеленые браузеры поддерживают динамический импорт, представляется удобным загружать некоторые скрипты прямо из GitHub. Но GitHub — это не сеть доставки контента (CDN). Он доставляет необработанные файлы всегда с неправильным заголовком типа содержимого (это всегда текст/обычный вместо текст/css или приложение/javascript) и применяет строгие ограничения скорости.

К счастью, некоторые CDN обслуживаются напрямую с GitHub:

raw.githack.com

GitHack обслуживает необработанные файлы непосредственно из исходного кода GitHub с соответствующими заголовками типа контента.

Чтобы получить URL-адреса CDN, скопируйте необработанный URL-адрес файла, который вы хотите импортировать, в свой скрипт. У каждого файла на веб-странице GitHub есть кнопка для получения необработанного URL-адреса.

Теперь вставьте необработанный URL-адрес в форму raw.githack.com, и он создаст два URL-адреса CDN:

  • Первый для production, размещенный на CloudFlare и привязанный к текущему коммиту. Если вы хотите получить доступ к своему файлу в производственном приложении, обязательно используйте этот URL-адрес. Если вы отправляете новую версию на GitHub, вам нужно создать новый URL-адрес.
  • Второй — для разработки. Если вы отправляете фиксацию на GitHub, изменения отражаются в течение нескольких минут. Этот URL-адрес предназначен для разработки, для производства используйте первый URL-адрес.

cdn.jsdelivr.net

JSDelivr имеет хорошую интеграцию с GitHub. Следующий необработанный URL-адрес GitHub

https://raw.githubusercontent.com/usystems/webling-plugins/main/examples/member-map/index.js

можно получить через JSDelivr

https://cdn.jsdelivr.net/gh/usystems/webling-plugins@latest/examples/member-map/index.js

Как это работает

  1. Замените http://raw.githubusercontent.com/ на https://cdn.jsdelivr.net/gh/. Убедитесь, что вы не забыли сегмент /gh/.
  2. Удалите «main» из URL-адреса, потому что JSDelivr всегда берет файл из основной ветки.
  3. Добавьте тег GitHub после репозитория. Либо тег из GitHub, например 1.0.0, либо latest для последней версии этого файла.

Если вы не добавите тег latest, JSDelivr будет кэшировать ваш файл и всегда доставлять один и тот же файл.

Если вы забудете добавить тег latest к вашему URL-адресу, JSDelivr через некоторое время обновится до новой версии. После фиксации новой версии может пройти некоторое время, прежде чем JSDelivr обновит свои кеши.

Вывод

Если вы хотите использовать файл непосредственно из GitHub, никогда не используйте необработанный URL-адрес GitHub, потому что GitHub довольно быстро заблокирует вашу учетную запись. Используйте CDN, например GitHack или JSDelivr.