From 0bd12a436a15d35ac59e4cf9ef04bb9dbfd8b8cd Mon Sep 17 00:00:00 2001 From: Luke Martin Date: Wed, 12 Jun 2024 14:08:23 +0100 Subject: [PATCH 1/3] Update `Weekly development reports` link to `Cardano updates` --- sidebars.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/sidebars.ts b/sidebars.ts index 0278dfce..3345d1a3 100644 --- a/sidebars.ts +++ b/sidebars.ts @@ -31,8 +31,8 @@ const sidebars: SidebarsConfig = { { type: 'autogenerated', dirName: 'developer-resources' }, { type: 'link', - label: 'Weekly development reports', - href: 'https://www.essentialcardano.io/development-update', + label: 'Cardano updates', + href: 'https://cardanoupdates.com/', className: 'external-link-with-separator', }, { From d6c0240ad6ddb4290eba4c7d80f30ce94ffbe3d9 Mon Sep 17 00:00:00 2001 From: Luke Martin Date: Wed, 12 Jun 2024 14:09:09 +0100 Subject: [PATCH 2/3] Remove `Plutus fee estimator` --- .../06-tools/03-plutus-fee-estimator.mdx | 43 -- redirects.ts | 5 +- src/components/SmartContractCalculator.tsx | 569 ------------------ 3 files changed, 1 insertion(+), 616 deletions(-) delete mode 100644 docs/cardano-testnets/06-tools/03-plutus-fee-estimator.mdx delete mode 100644 src/components/SmartContractCalculator.tsx diff --git a/docs/cardano-testnets/06-tools/03-plutus-fee-estimator.mdx b/docs/cardano-testnets/06-tools/03-plutus-fee-estimator.mdx deleted file mode 100644 index 3696b07e..00000000 --- a/docs/cardano-testnets/06-tools/03-plutus-fee-estimator.mdx +++ /dev/null @@ -1,43 +0,0 @@ ---- -title: Plutus fee estimator -metaTitle: Plutus fee estimator ---- - -import SmartContractCalculator from '../../../src/components/SmartContractCalculator' - -The Plutus fee estimator has been developed by IOG performance experts for price -benchmarking and comparison. It uses information from real-world Plutus -transactions and current mainnet settings to predict the fees that will be -charged for a transaction. The estimator can be used to calculate fees for -actual transactions (e.g. to determine the fees that will be charged if the -network parameters change), and also to estimate fees for individual script -transactions or complete DApps before or during development. It may be useful to -determine the effect of script changes or optimizations on fees. - -The fee estimator needs three simple pieces of information: - -- **The total on-chain transaction size in bytes**: a simple transaction, for - example, is around 300 bytes, one with metadata is around 650 bytes, and - Plutus scripts are typically 4,000-8,000 bytes (future optimizations and - improvements will reduce this). -- **The number of computational (CPU) steps** that the script uses: each step - represents 1 picosecond of execution time on a benchmark machine. Typical - scripts should consume less than 1,000,000,000 (1 millisecond). -- **The number of memory units** that the script uses: this represents the - number of bytes that the script allocates. Typical scripts should consume less - than 1,000,000 memory units (1MB of memory allocation). - -It calculates the cost for the corresponding transaction using current mainnet -parameter settings, providing results in both ada and US dollars. - -The information that the fee estimator uses can either be obtained: - -- directly from a specific Plutus transaction using the Cardano node -- from information that the Plutus system provides. - -Users may also provide estimated values if they want to explore what-if -scenarios. This allows a range of possible fee estimates to be obtained prior to -or during smart contract development, which facilitates experimentation with -alternative implementation decisions. - - diff --git a/redirects.ts b/redirects.ts index 7763ce4e..f1c17250 100644 --- a/redirects.ts +++ b/redirects.ts @@ -426,10 +426,7 @@ export const redirects = [ to: '/about-cardano/new-to-cardano/staking-calculator', from: '/cardano-testnet/tools/staking-calculator/', }, - { - to: '/cardano-testnets/tools/plutus-fee-estimator', - from: '/cardano-testnet/tools/plutus-fee-estimator/', - }, + { to: '/stake-pool-operators/monitoring', from: '/development-guidelines/node-monitoring/', diff --git a/src/components/SmartContractCalculator.tsx b/src/components/SmartContractCalculator.tsx deleted file mode 100644 index a64d2a1b..00000000 --- a/src/components/SmartContractCalculator.tsx +++ /dev/null @@ -1,569 +0,0 @@ -import React, { useEffect, useState } from 'react' -import styled from 'styled-components' -import { MdRotateLeft, MdClear } from 'react-icons/md' -import TextField from '@material-ui/core/TextField' -import ReactTooltip from 'react-tooltip' - -import CardanoLogo from './StakingCalculator/CardanoLogo' - -export default function SmartContractCalculator() { - const [perByteCost, setPerByteCost] = useState(44) - const [perStepCost, setPerStepCost] = useState(0.0000721) - const [perMemUnitCost, setMemUnitCost] = useState(0.0577) - const [perTransactionCost, setPerTransactionCost] = useState(155381) - const [showParams, _setShowParams] = useState(false) - - const [adaPrice, setAdaPrice] = useState() - const [initialized, setInitialized] = useState(false) - const [unableToGetPrice, setUnableToGetPrice] = useState(false) - const [adaPriceScenario, setAdaPriceScenario] = useState(0) - - const [transactions, setTransactions] = useState([ - { - txSize: 0, - cpuSteps: 0, - memUnits: 0, - }, - ]) - - useEffect(() => { - const getAdaPrice = async () => { - try { - const res = await fetch( - 'https://api.coingecko.com/api/v3/coins/cardano', - ) - const data = await res.json() - // eslint-disable-next-line camelcase - const price = data?.market_data?.current_price?.usd - setAdaPrice(parseFloat(price)) - setAdaPriceScenario(parseFloat(price)) - setInitialized(true) - } catch (e) { - setUnableToGetPrice(true) - setAdaPrice(2.4) - setInitialized(true) - } - } - - if (!initialized) getAdaPrice() - }, [initialized]) - - const txPrice = (t: { txSize: any; cpuSteps: any; memUnits: any }) => - !t.txSize && !t.cpuSteps && !t.memUnits - ? 0 - : ((perByteCost || 0) * (t.txSize || 0) + - (perStepCost || 0) * (t.cpuSteps || 0) + - (perMemUnitCost || 0) * (t.memUnits || 0) + - (perTransactionCost || 0)) / - 1000000 - - const dappFee = () => { - let fee = 0 - for (const t of transactions) fee = fee + txPrice(t) - return fee - } - - return initialized ? ( - <> - - {showParams && ( - -
- { - let input = parseInt(e.target.value) - if (input < 0) input = 0 - setPerByteCost(input) - }} - onBlur={(e) => !e.target.value && setPerByteCost(0)} - /> -
- -
- { - let input = parseInt(e.target.value) - if (input < 0) input = 0 - setPerStepCost(input) - }} - onBlur={(e) => !e.target.value && setPerStepCost(0)} - /> -
- -
- { - let input = parseInt(e.target.value) - if (input < 0) input = 0 - setMemUnitCost(input) - }} - onBlur={(e) => !e.target.value && setMemUnitCost(0)} - /> -
- -
- setPerTransactionCost(parseInt(e.target.value))} - onBlur={(e) => !e.target.value && setPerTransactionCost(0)} - /> -
-
- )} - - {transactions.map((t, i) => ( - - Transaction {i + 1} - { - const txs = transactions - txs.splice(i, 1) - console.log(txs) - setTransactions([...txs]) - }} - > - - - - - { - const txs = transactions - let input = parseInt(e.target.value) - if (input < 0) input = 0 - - txs[i].txSize = input > 16384 ? 16384 : input - - setTransactions([...txs]) - }} - onBlur={(e) => { - if (e.target.value) return null - const txs = transactions - txs[i].txSize = 0 - setTransactions([...txs]) - }} - /> - - ? - - - - - { - const txs = transactions - let input = parseInt(e.target.value) - if (input < 0) input = 0 - txs[i].cpuSteps = input > 10000000000 ? 10000000000 : input - - setTransactions([...txs]) - }} - onBlur={(e) => { - if (e.target.value) return null - const txs = transactions - txs[i].cpuSteps = 0 - setTransactions([...txs]) - }} - /> - - ? - - - - - { - const txs = transactions - let input = parseInt(e.target.value) - if (input < 0) input = 0 - txs[i].memUnits = input > 11250000 ? 11250000 : input - setTransactions([...txs]) - }} - onBlur={(e) => { - if (e.target.value) return null - const txs = transactions - txs[i].memUnits = 0 - setTransactions([...txs]) - }} - /> - - ? - - - - - ₳ {txPrice(t).toFixed(6)} - Estimated Transaction Price in ADA - - - ))} - - - - {/* temporarily removed - setShowParams(!showParams)} - > - {showParams ? 'Hide' : 'Show'} network parameters - {showParams ? : } - - */} - - setTransactions([ - ...transactions, - { - txSize: 0, - cpuSteps: 0, - memUnits: 0, - }, - ]) - } - > - Add Transaction - - { - setPerByteCost(44) - setPerStepCost(0.0000721) - setMemUnitCost(0.0577) - setPerTransactionCost(155381) - setTransactions([ - { - txSize: 0, - cpuSteps: 0, - memUnits: 0, - }, - ]) - }} - > - Reset All{' '} - - - - - - - Total Estimated Dapp Fee: - -
- {' '} - ${(dappFee() * adaPrice!).toFixed(2)} USD - - When 1 ADA = ${adaPrice} - {!unableToGetPrice && Rate supplied by CoinGecko} - - -
-
- ${(dappFee() * adaPriceScenario).toFixed(2)} USD - - When 1 ADA = $ - setAdaPriceScenario(parseFloat(e.target.value))} - /> - - -
-
-
How are the costs calculated?
-

- Primitive Plutus operations (the internal building blocks) are evaluated - on a reference architecture to give the costs for each primitive in - terms of the basic CPU and memory units that it uses. These are scaled - based on the number of each different primitive that is used by a smart - contract, and overall costs for a smart contract are calculated based on - the current costs for each CPU and memory unit, plus the size of the - transaction (including the size of the script, plus any datums that it - needs). -
-
-
-

- - ) : ( -
Loading...
- ) -} - -const Controls = styled.div` - display: flex; -` - -const RoundedButton = styled.button` - cursor: pointer; - display: inline-flex; - align-items: center; - outline: 0; - align-items: center; - justify-content: center; - font-size: 1.5rem; - transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, - box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, - border 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; - font-family: Chivo, sans-serif; - font-weight: 400; - line-height: 1.7; - letter-spacing: 0.1rem; - width: 100%; - padding: 1rem 2rem; - border-radius: 1.8rem; - color: #0a38a6; - border: 1px solid #0033ad; - background-color: #fff; - - &:first-of-type { - margin-right: 10px; - } - - &:nth-of-type(2) { - margin-left: 10px; - } - - &:hover { - background-color: rgba(0, 51, 173, 0.04); - } - - span { - display: flex; - align-items: center; - margin-left: 5px; - } -` - -const Params = styled.div` - display: flex; - flex-wrap: wrap; - padding: 10px 0 25px 0; - - > div { - width: 50%; - padding: 0 20px 20px 20px; - } - - .MuiTextField-root { - width: 100%; - } -` - -const Transactions = styled.div` - font-size: 16px; - padding: 30px 0 0 0; -` - -const Transaction = styled.div` - border: 0.1rem solid rgba(29, 30, 33, 0.3); - padding: 30px; - background-color: rgba(0, 51, 173, 0.04); - border-radius: 1.8rem; - position: relative; - margin-bottom: 30px; -` - -const Fields = styled.div` - padding: 20px 0 40px 0; - display: flex; - flex-wrap: wrap; - --margin: 1rem; - --multiplier: calc(720px - 100%); - margin: calc(var(--margin) * -1); /* excess margin removed */ - - & > * { - min-width: calc(33% - (var(--margin) * 2)); /* remove from both sides */ - max-width: 100%; - flex-grow: 1; - flex-basis: calc(var(--multiplier) * 999); - margin: var(--margin); - } -` - -const Title = styled.h4` - font-size: 18px; - margin: 0 0 10px 0; -` - -const DeleteButton = styled.button` - position: absolute; - top: -15px; - right: -15px; - cursor: pointer; - display: flex; - align-items: center; - outline: 0; - align-items: center; - justify-content: center; - transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, - box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, - border 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; - border-radius: 40px; - color: #0a38a6; - border: 1px solid #0033ad; - background-color: #fff; - height: 30px; - width: 30px; - - &:hover { - background-color: rgba(0, 51, 173, 0.04); - } -` - -const TxPrice = styled.span` - font-size: 14px; - - span { - font-size: 22px; - display: block; - } -` - -const Results = styled.div` - display: flex; - margin-bottom: 70px; - - @media screen and (max-width: 600px) { - display: block; - } - - > div { - flex: 1; - overflow: hidden; - position: relative; - border-radius: 0.4rem; - height: 200px; - border: 1px solid #0033ad; - - display: flex; - justify-content: center; - align-items: center; - flex-direction: column; - font-size: 18px; - - &:first-of-type { - margin-right: 10px; - background-color: #0033ad; - color: #fff; - } - - &:nth-of-type(2) { - margin-left: 20px; - } - - > div { - position: absolute; - bottom: 0; - - svg { - height: 130px; - margin-bottom: 1rem; - } - } - - &:first-of-type > div { - left: 0; - transform: translate(-45%, 45%); - } - - &:last-of-type > div { - right: 0; - transform: translate(45%, 45%); - } - - @media screen and (max-width: 600px) { - margin: 0 0 20px 0 !important; - } - - input { - width: 60px; - font-size: 14px; - border: 1px solid rgba(0, 0, 0, 0.42); - padding-left: 0 3px; - margin-left: 5px; - } - } -` - -const FeeTitle = styled.h4` - margin: 55px 0 25px 0; -` - -const Price = styled.span` - font-size: 38px; - font-weight: 300; - display: block; -` - -const PriceInfo = styled.span` - display: block; - text-align: center; - font-size: 14px; - - span { - display: block; - font-size: 11px; - } -` - -const FieldContainer = styled.div` - position: relative; - padding: 0; - - label { - font-size: 20px; - } -` - -const Tooltip = styled.div` - background-color: #7e98d4; - display: flex; - width: 16px; - height: 16px; - justify-content: center; - align-items: center; - border-radius: 18px; - color: #fff; - font-weight: bold; - font-size: 12px; - cursor: pointer; - position: absolute; - top: 0; - left: 180px; -` From f909d1b70db7df0f16396ba5eb101cf2029013ec Mon Sep 17 00:00:00 2001 From: Luke Martin Date: Wed, 12 Jun 2024 14:34:00 +0100 Subject: [PATCH 3/3] Position the "Edit this page" button at the top of the document --- src/css/custom.css | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) diff --git a/src/css/custom.css b/src/css/custom.css index 4a7daa50..6520f164 100644 --- a/src/css/custom.css +++ b/src/css/custom.css @@ -297,3 +297,19 @@ body { padding: 3rem 1.5rem; } } + +/* Position the "Edit this page" button at the top of the document */ +@media (min-width: 650px) { + .container article { + position: relative; + } + .breadcrumbs { + padding-top: 0.5rem; + padding-right: 8.75rem; + } + .theme-edit-this-page { + position: absolute; + top: 0.625rem; + right: 0; + } +}