prismicio / prismic-next

Helpers to integrate Prismic into Next.js apps
https://prismic.io/docs/technologies/nextjs
Apache License 2.0
57 stars 7 forks source link

refactor: use `next/script` to load the Prismic Toolbar #46

Closed angeloashmore closed 2 years ago

angeloashmore commented 2 years ago

Types of changes

Description

This PR changes <PrismicPreview>'s implementation to load the Prismic Toolbar from @prismicio/react's <PrismicToolbar> to Next.js's next/script.

Using next/script optimizes external script loading to work with Next.js's hydration execution. It also allows us to remove @prismicio/react as a dependency.

As of this PR, <PrismicPreview> uses next/script's lazyOnload loading strategy. This loads the Prismic Toolbar after higher priority resources have loaded, improving perceved performance. Because the toolbar is used primarily for previews and not critical data loading for public users, loading the toolbar slightly later should not be an issue.

Closes #39

Checklist:

🦥

github-actions[bot] commented 2 years ago

size-limit report 📦

Path Size
./dist/index.cjs 5.92 KB (-33.53% 🔽)
./dist/index.js 2.75 KB (-34.9% 🔽)
codecov-commenter commented 2 years ago

Codecov Report

Merging #46 (433d00c) into main (bd8f2d2) will not change coverage. The diff coverage is 100.00%.

@@            Coverage Diff            @@
##              main       #46   +/-   ##
=========================================
  Coverage   100.00%   100.00%           
=========================================
  Files           11        11           
  Lines          713       715    +2     
  Branches        43        43           
=========================================
+ Hits           713       715    +2     
Impacted Files Coverage Δ
src/PrismicPreview.tsx 100.00% <100.00%> (ø)

Help us with your feedback. Take ten seconds to tell us how you rate us. Have a feature suggestion? Share it here.