The term has gained some popularity lately, as a metaphor for a mostly static page (the sea), sprinkled with interactive sections (the islands).
With the page is pre-rendered just like in server-side rendering, but JS is automatically added for the interactive bits, making it easier to use than manually attaching JS to existing elements, and more optimal than hydrating the entire page.
philosophy is to provide a smooth integration with Vite.js and its wonderful plugin ecosystem, and enable using components from any frameworks so that you can focus on shipping value.
Would like to hear more? Listen to this recent podcast.
There are more mature tools that might be a better choice, such as Vuepress.
Project Status: Beta
APIs may change on minor releases. Lock the version to avoid breakage.
Pull requests to add more comparisons are welcome!
The main difference is that supports partial hydration, so you can ship JS only for the interactive parts of the page. Currently, partial hydration in VitePress is a manual process, and its default mode is targeted at building single-page applications.
VitePress has an MPA mode to strip away all JS. In that happens automatically if you don't use hydration directives.
Use VitePress if you are building a documentation website, don't need partial hydration, or if it has to be a single-page application.
When migrating an existing site from VitePress to , you might want to disable prettyUrls.
Astro is the main inspiration for partial hydration in .
Now that Astro is moving to Vite.js, the differences will become smaller.
The following is a list of features and differences to help you compare:
.astrofile format. In you use Vue or MDX pages
paginatehelper. In you have to do that manually.
Use Astro if you are not familiar with Vue, or don't like its template syntax.
Show some love by ⭐️ starring the project if you find it useful!