Skip to content

Commit

Permalink
(docs) README: incorporate links to latest demos
Browse files Browse the repository at this point in the history
  • Loading branch information
addyosmani authored Jul 18, 2019
1 parent ea1bf57 commit ed64779
Showing 1 changed file with 7 additions and 16 deletions.
23 changes: 7 additions & 16 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,29 +2,20 @@

An exploration into loading and rendering the most suitable version of a component based on signals exposed to the web (network, CPU, memory etc).

## Network-aware Components
## Demos

Network-aware components use the [Network Information API](https://developer.mozilla.org/en-US/docs/Web/API/Network_Information_API) to load the most suitable version of a component or resource for the user's effective connection speed.

Users on a slow (e.g 2G) connection may get a light, low-fi version while fast connections (e.g 4G) get a high-fi version with more interactive features.

This approach can enable a number of use-cases:

* Network-aware components
* Network-aware code-splitting
* Network-aware data-fetching

## Examples

### Simple
### Simpler
* [Network-aware loading](https://github.com/GoogleChromeLabs/network-aware-components/tree/master/cra-network-aware-component) with create-react-app
* [Network-aware code-splitting](https://github.com/GoogleChromeLabs/network-aware-components/tree/master/cra-network-aware-code-splitting) with create-react-app
* [Network-aware data-fetching](https://github.com/GoogleChromeLabs/environment-aware-components/tree/master/cra-network-aware-data-fetching)
* [Network-aware data-fetching](https://github.com/GoogleChromeLabs/environment-aware-components/tree/master/cra-network-aware-data-fetching) with create-react-app
* [Battery considerate loading](https://github.com/GoogleChromeLabs/environment-aware-components/tree/master/cra-battery-considerate-loading) with create-react-app
* [Memory considerate loading](https://github.com/GoogleChromeLabs/environment-aware-components/tree/master/cra-memory-considerate-loading) with create-react-app
* [UA-aware code-splitting](https://github.com/GoogleChromeLabs/environment-aware-components/tree/master/cra-ua-aware-code-splitting) with create-react-app

### Advanced
* [React Movie - network-aware components](https://github.com/GoogleChromeLabs/network-aware-components/tree/master/react-movie-network-aware-components)
* [React Shrine - network-aware code-splitting](https://github.com/GoogleChromeLabs/network-aware-components/tree/master/react-shrine-network-aware-code-splitting)

## Team

This project is brought to you by [Addy Osmani](https://github.com/addyosmani) and [Anton Karlovskiy](https://github.com/anton-karlovskiy).
This project is brought to you by [Addy Osmani](https://github.com/addyosmani) and [Anton Karlovskiy](https://github.com/anton-karlovskiy).

0 comments on commit ed64779

Please # to comment.