# @solid-primitives/page-visibility [](https://bundlephobia.com/package/@solid-primitives/page-visibility) [](https://www.npmjs.com/package/@solid-primitives/page-visibility) [](https://github.com/solidjs-community/solid-primitives#contribution-process) - [`createPageVisibility`](#createpagevisibility) - Creates a signal with a boolean value identifying the page visibility state - [`usePageVisibility`](#usepagevisibility) - A [singleton root](https://github.com/solidjs-community/solid-primitives/tree/main/packages/rootless#createSingletonRoot) alternative. ## Installation ``` npm install @solid-primitives/page-visibility # or yarn add @solid-primitives/page-visibility ``` ## `createPageVisibility` Creates a signal with a boolean value identifying the page visibility state. ### How to use it ```ts import { createPageVisibility } from "@solid-primitives/page-visibility"; const visible = createPageVisibility(); createEffect(() => { visible(); // => boolean }); ``` ## `usePageVisibility` `usePageVisibility` is a [singleton root](https://github.com/solidjs-community/solid-primitives/tree/main/packages/rootless#createSingletonRoot) primitive. It is providing the same signal as `createPageVisibility`, but the event-listener and the signal are shared between dependents, making it more optimized to use in multiple places at once. ### How to use it ```ts import { usePageVisibility } from "@solid-primitives/page-visibility"; const visible = usePageVisibility(); createEffect(() => { visible(); // => boolean }); ``` ## Changelog See [CHANGELOG.md](./CHANGELOG.md)