✨ Mention Frame Processor getting started steps more explicitly #420
Comments
mrousavy
changed the title
|
@ldstein you're a lifesaver!! I was stuck on that error until I saw this! 🎉 |
Merged
rrr-core
added a commit
to rrr-core/vision-camera
that referenced
this issue
Jul 11, 2024
See mrousavy/react-native-vision-camera#1376 ## Breaking Changes * Frame Processors are now **synchronous**. Previously they ran on a separate Thread. If you want to run something on a separate Thread now, use `runAsync` inside a Frame Processor * Frame Processor Plugins are no longer in the global object with the `__` prefix, but rather stored directly in the `FrameProcessorPlugins` object exported by react-native-vision-camera. (e.g. replace `__scanQRCodes(frame)` with `FrameProcessorPlugins.scanQRCodes(frame)`) * `frameProcessorFps` no longer exists. Use `runAtTargetFps` inside a Frame Processor to throttle some calls. * `onFrameProcessorPerformanceSuggestionAvailable` no longer exists. Use the FPS display (`enableFpsGraph={true}`) to see how your Frame Processor performs over time. This is more in-line with how React Native works (Dev Tools / Perf Monitor) * VisionCamera V3 will not work on RN 0.70 or below. You need to use RN 0.71. This is because the build script got way simpler and smaller, making it faster to build and way less error prone. Backwards compatibility is just too complex here. * Reanimated is no longer used as a Worklet Runtime. Instead, VisionCamera now uses [react-native-worklets-core](https://github.com/margelo/react-native-worklets-core). ## Progress You can test the latest V3 release by creating a new RN project with RN 0.71 and installing VisionCamera + RNWorklets: ```sh yarn add react-native-vision-camera@3.0.0-rc.5 yarn add react-native-worklets-core yarn add @shopify/react-native-skia ``` Things to test: * TensorFlow Lite plugin to load any `.tflite` model!! ✨ (see [this PR for more info](mrousavy/react-native-vision-camera#1633), will be a separate library soon) * Drawing onto a Frame using Skia!! 🎉 * Using `frame.toArrayBuffer()` to get the Frame's byte content in JS * New Android build script. This should drastically speed up the build time! 💨 * New Worklet library. This replaces Reanimated Worklets. Should be faster and more stable :) * New synchronous Frame Processors. Should be faster :) * `runAtTargetFps` and `runAsync` in Frame Processors * Using HostObjects or HostFunctions (like models from PyTorch) inside a Frame Processor. This will probably require a few native bindings on PyTorch's end to make the integration work (cc @raedle) Overall V3 is close to completion. I have a few things to do the coming days so not sure how much work I can put into this. **If anyone wants to support the development of v3, I'd appreciate donations / sponsors: https://github.com/sponsors/mrousavy** ❤️ :) ## Related issues features - resolves mrousavy/react-native-vision-camera#1376 - fixes mrousavy/react-native-vision-camera#281 - resolves mrousavy/react-native-vision-camera#211 - resolves mrousavy/react-native-vision-camera#130 - resolves mrousavy/react-native-vision-camera#117 - fixes mrousavy/react-native-vision-camera#76 - resolves mrousavy/react-native-vision-camera#75 - resolves mrousavy/react-native-vision-camera#562 - resolves mrousavy/react-native-vision-camera#565 - fixes mrousavy/react-native-vision-camera#570 - fixes mrousavy/react-native-vision-camera#287 - resolves mrousavy/react-native-vision-camera#311 - fixes mrousavy/react-native-vision-camera#315 - resolves mrousavy/react-native-vision-camera#323 - fixes mrousavy/react-native-vision-camera#340 - fixes mrousavy/react-native-vision-camera#354 - resolves mrousavy/react-native-vision-camera#420 - fixes mrousavy/react-native-vision-camera#434 - fixes mrousavy/react-native-vision-camera#452 - fixes mrousavy/react-native-vision-camera#496 - fixes mrousavy/react-native-vision-camera#497 - resolves mrousavy/react-native-vision-camera#499 - fixes mrousavy/react-native-vision-camera#516 - fixes mrousavy/react-native-vision-camera#527 - fixes mrousavy/react-native-vision-camera#542 - fixes mrousavy/react-native-vision-camera#548 - fixes mrousavy/react-native-vision-camera#561 - fixes mrousavy/react-native-vision-camera#740 - fixes mrousavy/react-native-vision-camera#770 ...and then pretty much every Android issue lol - fixes mrousavy/react-native-vision-camera#1675 (**maybe**, please test @PrernaBudhraja) - fixes mrousavy/react-native-vision-camera#1671 .. maybe also (not tested): - fixes mrousavy/react-native-vision-camera#1698 - fixes mrousavy/react-native-vision-camera#1687 - fixes mrousavy/react-native-vision-camera#1685 - fixes mrousavy/react-native-vision-camera#1681 - fixes mrousavy/react-native-vision-camera#1650 - fixes mrousavy/react-native-vision-camera#1646 - fixes mrousavy/react-native-vision-camera#1635 - fixes mrousavy/react-native-vision-camera#1631 - fixes mrousavy/react-native-vision-camera#1621 - fixes mrousavy/react-native-vision-camera#1615 - fixes mrousavy/react-native-vision-camera#1612 - fixes mrousavy/react-native-vision-camera#1605 - fixes mrousavy/react-native-vision-camera#1599 - fixes mrousavy/react-native-vision-camera#1585 - fixes mrousavy/react-native-vision-camera#1581 - fixes mrousavy/react-native-vision-camera#1569 - fixes mrousavy/react-native-vision-camera#1568 - fixes mrousavy/react-native-vision-camera#1565 - fixes mrousavy/react-native-vision-camera#1561 - fixes mrousavy/react-native-vision-camera#1558 - fixes mrousavy/react-native-vision-camera#1554 - fixes mrousavy/react-native-vision-camera#1551 - fixes mrousavy/react-native-vision-camera#1547 - fixes mrousavy/react-native-vision-camera#1543 - fixes mrousavy/react-native-vision-camera#1538 - fixes mrousavy/react-native-vision-camera#1536 - fixes mrousavy/react-native-vision-camera#1534 - fixes mrousavy/react-native-vision-camera#1528 - fixes mrousavy/react-native-vision-camera#1520 - fixes mrousavy/react-native-vision-camera#1498 - fixes mrousavy/react-native-vision-camera#1489 - fixes mrousavy/react-native-vision-camera#1477 - fixes mrousavy/react-native-vision-camera#1474 - fixes mrousavy/react-native-vision-camera#1463 - fixes mrousavy/react-native-vision-camera#1462 - fixes mrousavy/react-native-vision-camera#1449 - fixes mrousavy/react-native-vision-camera#1443 - fixes mrousavy/react-native-vision-camera#1437 - fixes mrousavy/react-native-vision-camera#1431 - fixes mrousavy/react-native-vision-camera#1429 - fixes mrousavy/react-native-vision-camera#1427 - fixes mrousavy/react-native-vision-camera#1423 - fixes mrousavy/react-native-vision-camera#1416 - fixes mrousavy/react-native-vision-camera#1407 - fixes mrousavy/react-native-vision-camera#1403 - fixes mrousavy/react-native-vision-camera#1402 - fixes mrousavy/react-native-vision-camera#1398 - fixes mrousavy/react-native-vision-camera#1396 - fixes mrousavy/react-native-vision-camera#1395 - fixes mrousavy/react-native-vision-camera#1379 - fixes mrousavy/react-native-vision-camera#1377 - fixes mrousavy/react-native-vision-camera#1374 - fixes mrousavy/react-native-vision-camera#1373 - fixes mrousavy/react-native-vision-camera#1365 - fixes mrousavy/react-native-vision-camera#1356 - fixes mrousavy/react-native-vision-camera#1353 - fixes mrousavy/react-native-vision-camera#1352 - fixes mrousavy/react-native-vision-camera#1351 - fixes mrousavy/react-native-vision-camera#1343 - fixes mrousavy/react-native-vision-camera#1340 - fixes mrousavy/react-native-vision-camera#1334 - fixes mrousavy/react-native-vision-camera#1330 - fixes mrousavy/react-native-vision-camera#1322 - fixes mrousavy/react-native-vision-camera#1296 - fixes mrousavy/react-native-vision-camera#1283 - fixes mrousavy/react-native-vision-camera#1260 - fixes mrousavy/react-native-vision-camera#1253 - fixes mrousavy/react-native-vision-camera#1251 - fixes mrousavy/react-native-vision-camera#1245 - fixes mrousavy/react-native-vision-camera#1238 - fixes mrousavy/react-native-vision-camera#1227 - fixes mrousavy/react-native-vision-camera#1226 - fixes mrousavy/react-native-vision-camera#1225 - fixes mrousavy/react-native-vision-camera#1222 - fixes mrousavy/react-native-vision-camera#1211 - fixes mrousavy/react-native-vision-camera#1208 - fixes mrousavy/react-native-vision-camera#1193 - fixes mrousavy/react-native-vision-camera#1191 - fixes mrousavy/react-native-vision-camera#1184 - fixes mrousavy/react-native-vision-camera#1164 - fixes mrousavy/react-native-vision-camera#1143 - fixes mrousavy/react-native-vision-camera#1128 - fixes mrousavy/react-native-vision-camera#1122 - fixes mrousavy/react-native-vision-camera#1120 - fixes mrousavy/react-native-vision-camera#1110 - fixes mrousavy/react-native-vision-camera#1097 - fixes mrousavy/react-native-vision-camera#1081 - fixes mrousavy/react-native-vision-camera#1080 - fixes mrousavy/react-native-vision-camera#1064 - fixes mrousavy/react-native-vision-camera#1053 - fixes mrousavy/react-native-vision-camera#1047 - fixes mrousavy/react-native-vision-camera#1044 - fixes mrousavy/react-native-vision-camera#1032 - fixes mrousavy/react-native-vision-camera#1026 - fixes mrousavy/react-native-vision-camera#1023 - fixes mrousavy/react-native-vision-camera#1015 - fixes mrousavy/react-native-vision-camera#1012 - fixes mrousavy/react-native-vision-camera#997 - fixes mrousavy/react-native-vision-camera#960 - fixes mrousavy/react-native-vision-camera#959 - fixes mrousavy/react-native-vision-camera#954 - fixes mrousavy/react-native-vision-camera#946 - fixes mrousavy/react-native-vision-camera#945 - fixes mrousavy/react-native-vision-camera#922 - fixes mrousavy/react-native-vision-camera#908 - fixes mrousavy/react-native-vision-camera#907 - fixes mrousavy/react-native-vision-camera#868 - fixes mrousavy/react-native-vision-camera#855 - fixes mrousavy/react-native-vision-camera#834 - fixes mrousavy/react-native-vision-camera#793 - fixes mrousavy/react-native-vision-camera#779 - fixes mrousavy/react-native-vision-camera#746 - fixes mrousavy/react-native-vision-camera#740 - fixes mrousavy/react-native-vision-camera#727 - fixes mrousavy/react-native-vision-camera#671 - fixes mrousavy/react-native-vision-camera#613 - fixes mrousavy/react-native-vision-camera#595 - fixes mrousavy/react-native-vision-camera#588 - fixes mrousavy/react-native-vision-camera#570 - fixes mrousavy/react-native-vision-camera#569 - fixes mrousavy/react-native-vision-camera#542 - fixes mrousavy/react-native-vision-camera#516 - fixes mrousavy/react-native-vision-camera#515 - fixes mrousavy/react-native-vision-camera#434 - fixes mrousavy/react-native-vision-camera#354 - fixes mrousavy/react-native-vision-camera#323 - fixes mrousavy/react-native-vision-camera#315 - fixes mrousavy/react-native-vision-camera#281 - fixes mrousavy/react-native-vision-camera#211 - fixes mrousavy/react-native-vision-camera#76
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
What feature or enhancement are you suggesting?
Hi,
This is a superb library. FrameProcessors are a game changer. I have a couple of suggestions for the getting started guide to help new users such as myself :)
import Reanimated from 'react-native-reanimated'to avoidundefined is not a functionrender errors with worklets.The second point in particular was a gotcha for me and didn't seem particularly well explained.
Edit - Apologies, this maybe a configuration issue on my end. The example at https://github.com/rodgomesc/vision-camera-qrcode-scanner works without the above steps. Not sure why my blank
npx react-native init AwesomeProjectrequired the the above steps to suppress theundefined is not a functionerror. Investigating further.What Platforms whould this feature/enhancement affect?
iOS, Android
Alternatives/Workarounds
Trawl the Github / Stackoverflow / Google for working solutions.
Additional information
The text was updated successfully, but these errors were encountered: