【原文】Эти три потрясающие JS-библиотеки стоит попробовать

JavaScript

Автор: Луис Петрик. Переводчик: Front-end Xiaozhi Источник: devglan

Ставьте лайк и смотрите снова, формируйте привычку

эта статьяGitHub GitHub.com/QQ449245884…Он был включен в вышеизложенное, и более ранние статьи с высокими похвалами были классифицированы, а также было систематизировано множество моих документов и учебных материалов. Добро пожаловать в Star and Perfect. Вы можете обратиться в тестовый центр для ознакомления во время собеседования. Надеюсь, у нас что-то получится вместе.

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

Basket.js

URL-адрес:addyosmani.com/basket.js/

Basket.jsэто чрезвычайно маленькая библиотека JS, сжатый размер составляет всего0.7 kB.

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

Но почему локальное хранилище вместо кеша браузера?

Во-первых, лично мне намного проще кэшировать файлы JavaScript через библиотеку JS в коде веб-страницы, которая обычно кэшируется со стороны сервера. использоватьBasket.jsДинамическое кэширование сценария управления JavaScript, теперь можно легко использовать код.

попробуй

Basket.jsAPI не так уж и сложен. Вы можете самостоятельно просмотреть документацию и попробовать ее самостоятельно. В нашем небольшом примере просто используйтеbasket.require, потому что это ядро ​​всей библиотеки.

  • basket.require()
  • basket.get()
  • basket.remove()
  • basket.clear()

использоватьbasket.require, мы можем пройтиbasketЗагрузите JS-файлы. Затем этот файл кэшируется в локальном хранилище (как и раньше) и будет сохранен на следующемbasket.requireкеш. Например, при перезагрузке страницы,BasketСначала будет искать в кеше, и если файл уже в нем закэширован, он загрузит файл из локального хранилища вместо повторного запроса по сети.

index.html:

добавь у тебя ОС you.com/basket.thats/of… CDN.JS Deli VR.net/Годовой рейтинг/RSVP@4/… CDN Acceleration.cloudflare.com/Ajax/Thursday/Just…

<!DOCTYPE html>
<html lang=”en”>
  <head>
    <meta charset=”UTF-8" />
    <script src=”rsvp.min.js”></script>
    <script src=”basket.min.js”></script>
    <title>Document</title>
</head>
<body>
  <script>
    basket.require({ url: '/scripts/jquery.js' })
  </script>
</body>
</html>

Как вы можете видеть выше, мы сначала импортировалиrsvpбиблиотека, затемBasketсебя, то в теле мы можем выполнить нашуrequireфункция для загрузки jQuery откуда-то.

При первом открытии страницы вы должны увидеть следующее:

Но когда страница перезагружается,jqueryне будет повторно запрашивать:

Все говорили, что нет проекта для написания резюме, поэтому я помог вам найти проект, и это было с бонусом.【Учебник по строительству】.

Pill

github: github.com/rumkin/pill

PillДобавлена ​​динамическая загрузка контента для статических сайтов, что делает загрузку контента более плавной для пользователей. Сжатая библиотека составляет примерно1kb.

**Суть:** Большинство из нас используют одностраничные приложения, чтобы иметь веб-приложения, которые не загружают целые новые страницы при навигации. В большинстве фреймворков SPA это делается, потому что все основано наindex.html.

Но что, если у нас есть несколько статических страниц?Pillявляется решением.

При необходимости он может получить содержимое других HTML-файлов на сервере и заменить текущее содержимое новым извлеченным файлом. Поскольку наше приложение не требует новых страниц, это может значительно повысить производительность.

использоватьPill, что выполняется автоматически, так как перехватывает попытки навигации.

PillЕще одним хорошим моментом является то, что его документация хорошо сделана, больше возможностей можно найти вДокументациянайти в.

JS-cookie

гитхаб:GitHub.com/just-cookie/просто…

использовать в браузереCookieМожет быть очень трудоемким.JS-cookiesСделать это проще, сейчас мы познакомим с базовыми знаниями.

Загрузка через CDN:

<script src="https://cdn.jsdelivr.net/npm/js-cookie@beta/dist/js.cookie.min.js"></script>

установить имя'name'ключ cookie для , значение которого равно'前端小智'

Cookies.set('name', '前端小智')

использовать'name'ключ, чтобы получить значение файла cookie

Cookies.get('name') // '前端小智'

Создайте файл cookie со сроком действия 7 дней:

Cookies.remove('name')

Получить все файлы cookie

Cookies.get() // { name: '前端小智' }

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

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

оригинал:woohoo.Devolive.com/local/afraid/Q Нью-Джерси…

общаться с

Статья постоянно обновляется каждую неделю. Вы можете выполнить поиск «Big Move to the World» в WeChat, чтобы прочитать и обновить ее как можно скорее (на одну или две статьи раньше, чем в блоге). Эта статья находится на GitHub.GitHub.com/QQ449245884…Он был включен, и многие мои документы были разобраны. Добро пожаловать в Звезду и совершенство. Вы можете обратиться в тестовый центр для ознакомления во время собеседования. Кроме того, обратите внимание на паблик-аккаунт и ответьте в фоновом режиме.Благосостояние, вы можете увидеть преимущества, вы знаете.

Категории