# Overview

Frame is an open source framework for publishing [web pages](https://www.frame.tools/frame/eth/1/0x612208653e00de208d4e4eab3c865ff781b84c64) to EVM-based block space. 

It consists of two components:

* A set of immutable smart contracts [deployed](https://docs.frame.tools/reference/deployed-contracts) to popular EVM-based networks, which are used for storing, retrieving, and rendering a cohesive web page.
* [FrameDataStore](https://docs.frame.tools/reference/technical-reference/framedatastore) contracts that hold reusable browser code already on-chain, such as [three.js](https://threejs.org/) and [p5.js](https://p5js.org/). Once data is added to these contracts it cannot be edited or removed.

The GitHub repo can be found [here](https://github.com/cncrde/frame-tools). 

### How it Works

Web pages are rendered from on-chain by iteratively calling the `renderPage` method on a [Frame](https://docs.frame.tools/reference/technical-reference/frame) contract and viewing the result in any modern web browser. 

Each Frame contract will usually reference two types of [FrameDataStore ](https://docs.frame.tools/reference/technical-reference/framedatastore)contracts for its data:

* Dependency data stores, such as [FrameTools](https://etherscan.io/address/0xddba0fe2a9d15e7885d1a944679280ac40420ce0), which contain already-on-chain code to be run in the web page on page load
* A newly-deployed data store containing any new browser code that will be run in the web page, after imported code is run

Frames can reference code that is already on-chain (and thus paid for), greatly reducing a creator's cost to create something reliant on powerful open source libraries. For example, the [FrameTools](https://etherscan.io/address/0xddba0fe2a9d15e7885d1a944679280ac40420ce0) contract provides access to [p5.js](https://p5js.org/) or [three.js](https://threejs.org/) for tiny percentage of their original on-chain storage cost.

### Use-Case

Web pages are really just containers for media. Frame was built to help creatives publish dynamic, high-fidelity media that lives entirely on-chain for as low of a cost as possible. 

A creator can also do more with code in the browser than in the EVM. For example, libraries in the Frame Tools data store are stored in a compressed format (gzip), and are decompressed on page load using code from the [fflate](https://github.com/101arrowz/fflate) js library.