Skip to content

docs: add image byte-budget tutorial - #3985

Draft
MarshallBear1 wants to merge 1 commit into
Shopify:mainfrom
MarshallBear1:agent/add-image-byte-budget-tutorial
Draft

docs: add image byte-budget tutorial#3985
MarshallBear1 wants to merge 1 commit into
Shopify:mainfrom
MarshallBear1:agent/add-image-byte-budget-tutorial

Conversation

@MarshallBear1

Copy link
Copy Markdown

Summary

Adds a written tutorial showing how to use React Native Skia's imperative API to decode a local image, resize it on an offscreen surface, and search across JPEG quality and dimensions until the decoded output fits a strict byte budget.

The tutorial includes:

  • a complete reusable TypeScript implementation;
  • exact Base64 decoded-byte accounting;
  • explicit disposal of Skia data, image, paint, snapshot, and surface objects; and
  • production notes on alpha, EXIF orientation, memory, request overhead, and server-side validation.

The example was extracted from production use, rewritten without application-specific dependencies or data, and checked against @shopify/react-native-skia 2.6.2. It is published under the MIT license.

Validation

  • branch is based on the current upstream main commit
  • tutorial and source resolve from the public default branch
  • tutorial implementation passes a strict TypeScript no-emit check against React Native Skia 2.6.2
  • known-value checks pass for Base64 byte accounting
  • this PR changes only apps/docs/docs/tutorials.md
  • git diff --check passes

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant