How to be Light Client friendly?
DappCon, 20 July 2018
Tomasz Drwięga, @tomusdrw
What is a Light Client?
A special kind of node that is, well, "light".
- Low resource usage:
CPU, Mem, Storage, IO - Embeddable
- But still trustless
Why Light Clients?
Sync Time
State Size
DB Size
Full Node
Light Node
~ days
~ seconds
~ gigs
0
~ tens of gigs
~ megs
Parity Ethereum?
- Deprecating the Parity Wallet (UI part)
- Focusing on the Core Tech (full/light node)
- Light Node + Light Wallet for casual users
How does it work?
Block 1
Block 2
Block 3
Transactions
Transactions
Transactions
(Header)
(Header)
(Header)
(Body)
(Body)
(Body)
State after 1
State after 2
State after 3
Full Node
How does it work?
Header 1
Header 2
Header 3
state_root
receipts_root
Light Node
state_root
receipts_root
state_root
receipts_root
We don't have the data, but we can verify it's validity if someone sends it
How development differs?
- no pending block or pending transactions
- actually no state at all
- no block bodies (no transactions) nor receipts
- network latency involved
- some calls are more "expensive"
How to write a dapp?
const contract = web3.eth.Contract(
ABI, "0x00..ff"
)
setInterval(async () => {
const balance = await contract.methods
.balanceOf("0x00..ff").call()
document.querySelector('#balance')
.textContent = balance
}, 500)What if the node can't respond fast enough?
Smart Polling?
const contract = web3.eth.Contract(
ABI, "0x00..ff"
)
async function updateBalance () {
const balance = await contract.methods
.balanceOf("0x00..ff").call()
document.querySelector('#balance')
.textContent = balance
}
const targetTime = 15 * 1000
setTimeout(function update () {
const next = Date.now() + targetTime;
updateBalance().then(() => {
setTimeout(update, next - Date.now())
})
})Trying to target the block time and account for latency
Publish-Subscribe
const contract = web3.eth.Contract(
ABI, "0x00..ff"
)
async function updateBalance () {
const balance = await contract.methods
.balanceOf("0x00..ff").call()
document.querySelector('#balance')
.textContent = balance
}
web3.eth
.subscribe('newBlockHeaders')
.on('data', updateBalance)Only fetch when we know it might have changed.
Libraries
>
Patterns
oo7-parity
Bonds for Ethereum
// npm i oo7-parity
import {Bonds} from 'oo7-parity'
const bonds = Bonds(/* Optional Transport */)
// Process a stream of latest block numbers
bonds.blockNumber
.map(b => `Current block: ${b}`)
.tie(console.log) // Current block: 4512345
// npm i oo7-parity
import {Bonds, hexToAscii} from 'oo7-parity'
const bonds = Bonds()
// A bond for latest block extra data
bonds.blocks[bonds.blockNumber]
.extraData
.map(hexToAscii)
.tie(console.log) // Parity.1.10
Bonds for Ethereum
You can compose the bonds
oo7
- Computational graph (but JS is 1-thread)
- "Simplified version of Observables"
- JavaScript without typings
- Insufficient documentation
- "Magical" (Proxy object)
light.js
Rx.js for Ethereum
- Reactive Extensions
- Typescript
- Minimal, high-level API
(not yet another RPC wrapper) - Light Client friendly
light.js
import { blockNumber$ } from '@parity/light.js'
import { filter } from 'rxjs/operators'
blockNumber$()
// Only log even blocks
.pipe(filter(n => n % 2 === 0))
.subscribe(console.log)Observables
light.js
import { defaultAccount$, makeContract}
from '@parity/light.js'
import { switchMap }
from 'rxjs/operators'
const contract = makeContract('0x00..ff', ABI)
defaultAccount$()
.pipe(switchMap(
account => contract.balanceOf$(account)
))
.subscribe(console.log)Calling Contracts
light.js
import light from '@parity/light.js-react'
import { syncing$ } from '@parity/light.js'
@light({
syncStatus: syncing$
})
class MyClass extends React.Component {
render() {
return (
<div>
{JSON.stringify(this.props.syncStatus)}
</div>
)
}
}React Integration
light.js
- Quite minimal currently
- Still working on the API
- Contributions welcome!
The Future?
- More APIs in light.js
- UI components libraries
- Parity Ethereum as a library
(Android / iOS) - Parity Ethereum as WASM
(Light node on a website)
Thank you
Tomasz Drwięga
@tomusdrw