docs: transaction optimization #3513

danielbate · 2024-12-31T14:40:19Z

Closes Add documentation for tx dependency optimisation technique #3495

Release notes

In this release, we:

Documented transaction optimisations and optimistic loading techniques

Checklist

All changes are covered by tests (or not applicable)
All changes are documented (or not applicable)
I reviewed the entire PR myself (preferably, on GH UI)
I described all Breaking Changes (or there's none)

vercel · 2024-12-31T14:40:23Z

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
fuels-template	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jan 2, 2025 10:02am
ts-docs	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jan 2, 2025 10:02am
ts-docs-api	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jan 2, 2025 10:02am

petertonysmith94 · 2024-12-31T15:16:56Z

Pre-optimization

%%{
  init: {
    'theme': 'base',
    'themeVariables': {
      'primaryColor': '#00F58C',
      'primaryTextColor': '#000000',
      'primaryBorderColor': '#00F58C',
      'lineColor': '#2B2B2B',
      'secondaryColor': '#1A1A1A',
      'tertiaryColor': '#00F58C',
      
      'mainBkg': '#000000',
      'secondaryBkg': '#1A1A1A',
      'mainContrastColor': '#FFFFFF',
      'darkTextColor': '#FFFFFF',
      'lightTextColor': '#000000',
      'textColor': '#FFFFFF',
      'altTextColor': '#FFFFFF',
      'borderColor': '#2B2B2B',
      
      'nodeBkg': '#1A1A1A',
      'nodeBorder': '#00F58C',
      'clusterBkg': '#1A1A1A',
      'clusterBorder': '#2B2B2B',
      'defaultLinkColor': '#00F58C',
      'fontFamily': 'SpaceGrotesk, -apple-system, BlinkMacSystemFont, "Segoe UI"',
      'fontSize': '14px'
    }
  }
}%%

sequenceDiagram
    User->>+DApp: Page load
    User->>+DApp: Clicks "Send Transaction"
    DApp->>+DApp: Prepare Transaction
    DApp->>+Network: Fetch dependencies
    Network->>+DApp: 
    DApp->>+DApp: Fund Transaction
    DApp->>+Network: Send transaction
    Network->>+DApp: Transaction confirmation
    DApp->>+User:

Post-optimization

sequenceDiagram
    User->>+DApp: Page load
    DApp->>+DApp: Prepare Transaction
    DApp->>+Network: Fetch dependencies
    Network->>+DApp: 
    DApp->>+DApp: Fund Transaction
    DApp->>+DApp: Cache pre-prepared transaction 

    User->>+DApp: Clicks "Send Transaction"
    DApp->>+DApp: Use pre-prepared cached transaction
    DApp->>+Network: Send transaction
    Network->>+DApp: Transaction confirmation
    DApp->>+User:

.changeset/young-schools-push.md

danielbate · 2024-12-31T17:02:01Z

apps/docs/src/guide/encoding/snippets/working-with-bytes.ts

This is just some formatting that was bugging me.

petertonysmith94

Nice. Just one point from me, is the consistency of naming of simulate vs estimate. It might be worth just picking one and rolling with it.

petertonysmith94 · 2024-12-31T17:05:48Z

apps/docs/src/guide/optimizing-transactions/index.md

+
+![Pre-optimization Tx Process](../../public/tx-optimization-before.png)
+
+This can be mitigated by optimistically building the transaction before your user submits the transaction. Pre-preparation of the transaction can improve the perceived speed of transactions by **~2x**.


Suggested change

This can be mitigated by optimistically building the transaction before your user submits the transaction. Pre-preparation of the transaction can improve the perceived speed of transactions by **~2x**.

This can be mitigated by optimistically building the transaction before your user submits the transaction. Pre-preparation of the transaction can improve the perceived speed of transactions.

Do we need to provide a figure?

Yeah, numbers can be tricky. I still think the whole message around this may have been framed incorrectly from the idea's inception. I will review this in-depth to provide better and more actionable feedback.

apps/docs/src/public/tx-optimization-after.png

petertonysmith94 · 2025-01-01T09:41:21Z

apps/docs/src/guide/optimizing-transactions/snippets/optimistic-transactions-before.ts

+  const sender = Wallet.fromPrivateKey(WALLET_PVT_KEY, provider);
+
+  // Calling the transfer function will create the transaction,
+  // and then perform multiple network requests to fund, simulate and submit


Suggested change

// and then perform multiple network requests to fund, simulate and submit

// and then perform multiple network requests to simulate, fund and submit

petertonysmith94 · 2025-01-01T09:42:27Z

apps/docs/src/public/tx-optimization-after.png

Should we rename "Fetch dependencies" to "Simulate transaction" to be synced with the examples?

petertonysmith94 · 2025-01-01T09:48:59Z

apps/docs/src/guide/optimizing-transactions/snippets/optimistic-transactions-after.ts

+  request.addCoinOutput(
+    Address.fromString(recipientAddress),
+    1_000_000,
+    provider.getBaseAssetId()
+  );


If the user clicks transfer without resetting the request, we could add another coin output.

petertonysmith94 · 2025-01-01T10:01:59Z

apps/docs/src/guide/optimizing-transactions/snippets/optimistic-contract-calls-after.ts

+  const { contract } = await waitForResult();
+
+  // Get the transaction request for the increment_count function
+  request = await contract.functions.increment_count(1).getTransactionRequest();


Suggested change

request = await contract.functions.increment_count(1).getTransactionRequest();

request = await contract.functions

.increment_count(1)

.getTransactionRequest();

petertonysmith94 · 2025-01-01T10:02:43Z

apps/docs/src/guide/optimizing-transactions/snippets/optimistic-contract-calls-after.ts

+  // When the user presses the increment button, we submit the transaction
+  // ensuring that the dependencies are not re-estimated and making redundant calls to the network


Suggested change

// When the user presses the increment button, we submit the transaction

// ensuring that the dependencies are not re-estimated and making redundant calls to the network

// When the user presses the increment button, we submit the transaction

// ensuring that the dependencies are not re-estimated

apps/docs/src/guide/optimizing-transactions/optimistic-predicates.md

petertonysmith94 · 2025-01-01T10:09:51Z

apps/docs/src/guide/optimizing-transactions/snippets/optimistic-predicates-after.ts

+  );
+  // Then we must alter any existing predicate data that may have changed
+  const predicateWithData = new ConfigurablePin({ provider, data: [pin] });
+  const requestWithData =
+    predicateWithData.populateTransactionPredicateData(request);
+  // And submit the transaction, ensuring that the dependencies are


Suggested change

);

// Then we must alter any existing predicate data that may have changed

const predicateWithData = new ConfigurablePin({ provider, data: [pin] });

const requestWithData =

predicateWithData.populateTransactionPredicateData(request);

// And submit the transaction, ensuring that the dependencies are

);

// Then we must alter any existing predicate data that may have changed

const predicateWithData = new ConfigurablePin({ provider, data: [pin] });

const requestWithData =

predicateWithData.populateTransactionPredicateData(request);

// And submit the transaction, ensuring that the dependencies are

petertonysmith94 · 2025-01-01T10:14:07Z

apps/docs/src/guide/optimizing-transactions/snippets/optimistic-predicates-before.ts

+  await fundTx.waitForResult();
+
+  // Calling the transfer function will create the transaction,
+  // and then perform multiple network requests to fund, simulate and submit


Suggested change

// and then perform multiple network requests to fund, simulate and submit

// and then perform multiple network requests to simulate, fund and submit

Co-authored-by: Peter Smith <[email protected]>

…/FuelLabs/fuels-ts into db/docs/transaction-optimisation

github-actions · 2025-01-02T09:50:54Z

Coverage Report:

Lines	Branches	Functions	Statements
77.83%(+0%)	70.5%(+0%)	75.5%(+0%)	77.79%(+0%)

Changed Files:

Coverage values did not change👌.

nedsalk · 2025-01-02T12:28:21Z

apps/docs/src/guide/optimizing-transactions/index.md

+
+- Fetching chain information to compute transaction data
+- Retrieving the gas price for cost estimation
+- Simulating the transaction to obtain missing or estimating transaction data


Suggested change

- Simulating the transaction to obtain missing or estimating transaction data

- Simulating the transaction to obtain missing data and estimate transaction costs

nedsalk · 2025-01-02T12:30:02Z

apps/docs/src/guide/optimizing-transactions/index.md

+- Simulating the transaction to obtain missing or estimating transaction data
+- Fetching funds for the transaction
+
+Depending on how you are performing the transaction, all of the above may have been abstracted away underneath a single function call that is performing multiple calls to the network to retrieve necessary information. Which gives the appearance of slowness for users interacting with your application.


Suggested change

Depending on how you are performing the transaction, all of the above may have been abstracted away underneath a single function call that is performing multiple calls to the network to retrieve necessary information. Which gives the appearance of slowness for users interacting with your application.

Depending on how you are performing the transaction, all of the above may have been abstracted away underneath a single function call that is performing multiple calls to the network to retrieve necessary information, which might give the appearance of slowness for users interacting with your application.

danielbate · 2025-01-03T10:33:16Z

Converting to draft whilst considering a change of approach

danielbate · 2025-01-03T12:17:59Z

Closing as changing approach

danielbate added 4 commits December 24, 2024 01:27

chore: rebuild

6c3460a

chore: rebuild

b5acb11

Merge branch 'master' of https://github.com/FuelLabs/fuels-ts

7e26880

docs: optimistic transactions

2da9c34

danielbate added the docs Requests pertinent to documentation label Dec 31, 2024

danielbate self-assigned this Dec 31, 2024

vercel bot deployed to Preview – fuels-template December 31, 2024 14:42 View deployment

vercel bot deployed to Preview – ts-docs-api December 31, 2024 14:42 View deployment

vercel bot deployed to Preview – ts-docs December 31, 2024 14:46 View deployment

feat: optimistic contract calls

f157187

vercel bot deployed to Preview – ts-docs-api December 31, 2024 15:13 View deployment

vercel bot deployed to Preview – ts-docs December 31, 2024 15:13 View deployment

vercel bot deployed to Preview – fuels-template December 31, 2024 15:17 View deployment

docs: optimistic predicates

43fbfc7

vercel bot deployed to Preview – ts-docs-api December 31, 2024 16:48 View deployment

vercel bot deployed to Preview – fuels-template December 31, 2024 16:48 View deployment

vercel bot deployed to Preview – ts-docs December 31, 2024 16:52 View deployment

danielbate added 2 commits December 31, 2024 16:53

docs: add diagrams

e2682a0

chore: changeset

702ff62

danielbate commented Dec 31, 2024

View reviewed changes

.changeset/young-schools-push.md Outdated Show resolved Hide resolved

chore: update changeset

d68e10b

danielbate marked this pull request as ready for review December 31, 2024 16:55

danielbate requested review from digorithm, arboleya, Torres-ssf, Dhaiwat10, nedsalk and petertonysmith94 as code owners December 31, 2024 16:56

danielbate requested a review from maschad as a code owner December 31, 2024 16:56

danielbate changed the title ~~docs: transaction optimisation~~ docs: transaction optimization Dec 31, 2024

vercel bot deployed to Preview – ts-docs December 31, 2024 17:01 View deployment

vercel bot deployed to Preview – fuels-template December 31, 2024 17:01 View deployment

danielbate commented Dec 31, 2024

View reviewed changes

vercel bot deployed to Preview – ts-docs-api December 31, 2024 17:05 View deployment

petertonysmith94 reviewed Jan 1, 2025

View reviewed changes

danielbate and others added 3 commits January 2, 2025 09:22

docs: change snippet

23047d8

Co-authored-by: Peter Smith <[email protected]>

docs: add file ending

32b3145

Merge branch 'db/docs/transaction-optimisation' of https://github.com…

48f00eb

…/FuelLabs/fuels-ts into db/docs/transaction-optimisation

vercel bot deployed to Preview – ts-docs-api January 2, 2025 09:58 View deployment

vercel bot deployed to Preview – fuels-template January 2, 2025 09:59 View deployment

vercel bot deployed to Preview – ts-docs January 2, 2025 10:02 View deployment

nedsalk reviewed Jan 2, 2025

View reviewed changes

danielbate marked this pull request as draft January 3, 2025 10:33

danielbate mentioned this pull request Jan 3, 2025

Introduce the autoCost helper for transaction requests #3535

Open

danielbate closed this Jan 3, 2025

arboleya deleted the db/docs/transaction-optimisation branch January 3, 2025 12:20

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

docs: transaction optimization #3513

docs: transaction optimization #3513

danielbate commented Dec 31, 2024 •

edited

Loading

vercel bot commented Dec 31, 2024 •

edited

Loading

petertonysmith94 commented Dec 31, 2024 •

edited

Loading

danielbate Dec 31, 2024

petertonysmith94 left a comment

petertonysmith94 Dec 31, 2024

arboleya Jan 2, 2025

petertonysmith94 Jan 1, 2025

petertonysmith94 Jan 1, 2025

petertonysmith94 Jan 1, 2025

petertonysmith94 Jan 1, 2025

petertonysmith94 Jan 1, 2025

petertonysmith94 Jan 1, 2025

petertonysmith94 Jan 1, 2025

github-actions bot commented Jan 2, 2025

nedsalk Jan 2, 2025

nedsalk Jan 2, 2025

danielbate commented Jan 3, 2025

danielbate commented Jan 3, 2025


		![Pre-optimization Tx Process](../../public/tx-optimization-before.png)

		This can be mitigated by optimistically building the transaction before your user submits the transaction. Pre-preparation of the transaction can improve the perceived speed of transactions by ~2x.

	// and then perform multiple network requests to fund, simulate and submit
	// and then perform multiple network requests to simulate, fund and submit

		// When the user presses the increment button, we submit the transaction
		// ensuring that the dependencies are not re-estimated and making redundant calls to the network

	- Simulating the transaction to obtain missing or estimating transaction data
	- Simulating the transaction to obtain missing data and estimate transaction costs

	Depending on how you are performing the transaction, all of the above may have been abstracted away underneath a single function call that is performing multiple calls to the network to retrieve necessary information. Which gives the appearance of slowness for users interacting with your application.
	Depending on how you are performing the transaction, all of the above may have been abstracted away underneath a single function call that is performing multiple calls to the network to retrieve necessary information, which might give the appearance of slowness for users interacting with your application.

docs: transaction optimization #3513

docs: transaction optimization #3513

Conversation

danielbate commented Dec 31, 2024 • edited Loading

Release notes

Checklist

vercel bot commented Dec 31, 2024 • edited Loading

petertonysmith94 commented Dec 31, 2024 • edited Loading

Pre-optimization

Post-optimization

Choose a reason for hiding this comment

petertonysmith94 left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

github-actions bot commented Jan 2, 2025

Choose a reason for hiding this comment

Choose a reason for hiding this comment

danielbate commented Jan 3, 2025

danielbate commented Jan 3, 2025

danielbate commented Dec 31, 2024 •

edited

Loading

vercel bot commented Dec 31, 2024 •

edited

Loading

petertonysmith94 commented Dec 31, 2024 •

edited

Loading