v1.9.0
Release 1.9.0 - useScript
Stable
useScript
is built to provide better performance and DX when working with Third-Party Scripts. In this release we reduce the composable size has been reduced by 30% with some notable breaking changes:
Removed trigger idle
While this was handy in user-land, providing support for it meant providing a polyfill for window.requestIdleCallback
due to limited browser support. Most integrations will already ship a polyfill for this so it added extra unnecessary weight.
If you'd like to re-implement this behaviour there's a recipe on the docs and you should provide your own polyfill (if needed).
Early connections removed
When using the composable it would try and guess how the script is being used and append a dns-prefetch
or a preconnect
<link>
depending on usage. To reduce the composable weight, this should now be implemented in user or integration land.
<link rel="dns-prefetch" href="<script-domain>" />
Awaiting Script Changes
When you wanted to avoid using the Proxy API and use the script instance directly, you could use the $script.waitForLoad()
function. To reduce the weight, the $script
object itself is now a promise:
const { $script } = useScript('<src>', { use: () => window.myScript })
$script
.then(instance => {
// script is loaded, instance is the same as window.myScript
})
.catch(() => {
// script failed to load
})
Changelog
🚨 Breaking Changes
- script:
- Remove
script:transform
hook - by @harlan-zw (1b153) $script
promisable, removewaitForLoad
- by @harlan-zw (4646d)- Remove
$script.loaded
- by @harlan-zw (7cba5) - EventContext option, skip
onabort
,onprogress
events - by @harlan-zw (335f4) - Remove early connections - by @harlan-zw (0ebac)
- Remove
🐞 Bug Fixes
- script: Typed
data-*
keys - by @harlan-zw (e8ca7)