New Architecture support

[elencho]

Describe the bug
A clear and concise description of what the bug is.
"FastImageView" doesn't support fabric

To Reproduce
Steps to reproduce the behavior if possible, or a link to a reproduction repo:

1. just add fastImage component to new architecture

Expected behavior
PLS add new archcitecture support

Screenshots
If applicable, add screenshots to help explain your problem.

Dependency versions

• React Native version: 0.71.4
• React version: 18.0.0
• React Native Fast Image version:8.6.2

Note: if these are not the latest versions of each I recommend updating as extra effort will not be taken to be backwards compatible, and updating might resolving your issue.

[suman379]

Facing the same problem.

React native version : 0.71.4
React version : 18.2.0
React native Fastimage version : 8.6.3

[bytemtek]

Same +1

[norbusonam]

Me too. Found this PR but it doesn't look like anyone has considered it yet: #951

[kr-yeon]

+1 why he doesn't look this PR #951 ?
@DylanVann

[lchenfox]

Please publish a new version if you are free, thank you. @DylanVann

[DreamakerDimas]

+1 Will be great to have Fabric support

[tomgreco]

@DylanVann please stay on top of this or look for more maintainers 🙏

[pietro-marrone-dka]

@DylanVann fabric support would be great

[baronha]

@DylanVann any update?

[tomgreco]

@DylanVann hand over the repo to someone else who will maintain it since you've disappeared!

[waqas19921]

I think this lib can now be used using the interop layer as discussed here reactwg/react-native-new-architecture#135

[lchenfox]

So, has this repo already been completely abandoned now? it's not been updated for a long time. 😅💔

[griffinbaker12]

used to be the best react native img lib :(
expo image is up and coming but not as good as fast image in some use cases

[mrshahzeb7]

I was also facing this
you can use the "New Renderer Interop Layer"
The interop layer is shipped with React Native 0.72

Just add component name like this in react-native.config.js

module.exports = {
project:{
android: {
unstable_reactLegacyComponentNames: [ "ComponentName" ]
},
ios: {
unstable_reactLegacyComponentNames: [ "ComponentName" ]
}
},
};

"The interop layer is a feature that lets you reuse legacy Native Components in New Architecture apps"

Read More
https://github.com/reactwg/react-native-new-architecture/discussions/135

[istvan-szilagyi]

@mrshahzeb7 ComponentName in this case is "FastImageView" right? After adding it it's all good on Android, but it crashes on iOS at this line (in file LegacyViewManagerInteropComponentDescriptor.m):

Class viewManagerClass = getViewManagerFromComponentName(componentName); assert(viewManagerClass);

Looks like it cannot find the view manager class.

Any ideea what's wrong?

This is my react-native.config.js file:

module.exports = { assets: ['./src/assets/fonts/'], project: { android: { unstable_reactLegacyComponentNames: [ 'BVLinearGradient', 'FastImageView', ], }, ios: { unstable_reactLegacyComponentNames: [ 'BVLinearGradient', 'FastImageView', ], }, }, };

PS: I needed it for react-native-linear-gradient component as well, that's working fine on both platforms.

[mrshahzeb7]

@mrshahzeb7 ComponentName in this case is "FastImageView" right? After adding it it's all good on Android, but it crashes on iOS at this line (in file LegacyViewManagerInteropComponentDescriptor.m):

Class viewManagerClass = getViewManagerFromComponentName(componentName); assert(viewManagerClass);

Looks like it cannot find the view manager class.

Any ideea what's wrong?

This is my react-native.config.js file:

module.exports = { assets: ['./src/assets/fonts/'], project: { android: { unstable_reactLegacyComponentNames: [ 'BVLinearGradient', 'FastImageView', ], }, ios: { unstable_reactLegacyComponentNames: [ 'BVLinearGradient', 'FastImageView', ], }, }, };

PS: I needed it for react-native-linear-gradient component as well, that's working fine on both platforms.

I Just added in the android not IOS!

my react-native.config.js
module.exports = {
project: {
ios: {},
android: {
unstable_reactLegacyComponentNames: ["FastImageView", "BVLinearGradient"],
},
},
assets: ["./app/assets/fonts"],
}

[istvan-szilagyi]

@mrshahzeb7 But that way on iOS they don't get rendered, just seeing those red boxes telling it's not supporting Fabric yet. You're just building your app for Android?

[mrshahzeb7]

@mrshahzeb7 But that way on iOS they don't get rendered, just seeing those red boxes telling it's not supporting Fabric yet. You're just building your app for Android?

Yes i am using using both platform and it working fine for me

Now I have to recheck whether the new arch is enabled or not on ios 🤔

But i didn't get any issues in ios

I have added a script "pod-install" in package.json and in that i have added "RCT_NEW_ARCH_ENABLEB=1"

Please note I created project from scratch with new Arch enabled

[istvan-szilagyi]

Then I have to say that you are not on new arch on iOS, if you enable it (and yes I did it in the same way as you with adding it to pod install script):

"pod-install": "cd ios && RCT_NEW_ARCH_ENABLED=1 bundle exec pod install && cd ..",

But I'm seeing same red boxes for gradient and fast image views (just as it was for Android initially). Adding BVLinearGradient fixes the gradient views, but adding FastImageView makes the app crash (on iOS)

If you run the app locally, after the bundle is loaded from metro you should see in logs "fabric":true if you're on the new arch

[nguyenduythuc]

Then I have to say that you are not on new arch on iOS, if you enable it (and yes I did it in the same way as you with adding it to pod install script):

"pod-install": "cd ios && RCT_NEW_ARCH_ENABLED=1 bundle exec pod install && cd ..",

But I'm seeing same red boxes for gradient and fast image views (just as it was for Android initially). Adding BVLinearGradient fixes the gradient views, but adding FastImageView makes the app crash (on iOS)

If you run the app locally, after the bundle is loaded from metro you should see in logs "fabric":true if you're on the new arch

Same on me, any solutions? :(

[vanhoutk]

@mrshahzeb7 ComponentName in this case is "FastImageView" right? After adding it it's all good on Android, but it crashes on iOS at this line (in file LegacyViewManagerInteropComponentDescriptor.m):

Class viewManagerClass = getViewManagerFromComponentName(componentName); assert(viewManagerClass);

Looks like it cannot find the view manager class.

Any ideea what's wrong?

This is my react-native.config.js file:

module.exports = { assets: ['./src/assets/fonts/'], project: { android: { unstable_reactLegacyComponentNames: [ 'BVLinearGradient', 'FastImageView', ], }, ios: { unstable_reactLegacyComponentNames: [ 'BVLinearGradient', 'FastImageView', ], }, }, };

PS: I needed it for react-native-linear-gradient component as well, that's working fine on both platforms.

Getting the same issue, would love to know if anyone has a patch to sort this / can identify the issue

[001bufanbin]

Step 1: Inside react-native.config.js just like under
module.exports = { project: { android: {}, ios: { unstable_reactLegacyComponentNames: [ "FastImageView" ], }, }, };
Step 2: Rename FFFastImageView to RCTFastImageView; RCTFastImageViewManager to RCTFastImageViewManager
Step 3: Add [self reloadImage]; to the setSource and setDefaultSource methods in RCTFastImageView.m file.
Step 4: Re-run pod install (with RCT_NEW_ARCH_ENABLED=1)
This way, you can use this library under the new architecture. I hope this helps you.