https://github.com/uppercod/lazy

https://github.com/uppercod/lazy

Last synced: about 1 year ago
JSON representation

• Host: GitHub
• URL: https://github.com/uppercod/lazy
• Owner: UpperCod
• Created: 2019-05-20T03:27:28.000Z (about 7 years ago)
• Default Branch: master
• Last Pushed: 2019-05-20T06:51:45.000Z (about 7 years ago)
• Last Synced: 2024-12-23T22:26:57.208Z (over 1 year ago)
• Language: JavaScript
• Size: 27.3 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# @atomico/lazy

[![CircleCI](https://circleci.com/gh/atomicojs/lazy.svg?style=svg)](https://circleci.com/gh/atomicojs/lazy)

[![npm](https://badgen.net/npm/v/@atomico/lazy)](http://npmjs.com/@atomico/lazy)

[![gzip](https://badgen.net/bundlephobia/minzip/@atomico/lazy)](https://bundlephobia.com/result?p=@atomico/lazy)

This function allows the dynamic importation of components.

```jsx

import { h } from "@atomico/core";

import { lazy } from "@atomio/lazy";

import Loading from "./components/loading";

let PageHome = lazy(() => import("./pages/home"));

function App() {

	return } />;

}

```

| Property | Type          | Description                                                                    |

| -------- | ------------- | ------------------------------------------------------------------------------ |

| loading  | string, vnode | the loading property will be tricked while waiting for the module's resolution |

## useLazy

This hooks allows to generate the same effect as lazy, but without depending on HoCs.

```jsx

function importHome() {

	return import("./page/home");

}

function App() {

	let state = useLazy(importHome);

	return state.loading ? "loading..." : state.default;

}

```