Repository navigation
Image fadeDuration property #461
Description
react-native has an android only property fadeDuration that adds a fade-in effect to images while they load.
This is set by default to 300ms leading to an unexpected inconsistency across platforms.
the issue was discussed here: react/react-native#10194
where was decided to add a prop to control it, but not removing the default value to avoid breaking changes.
I'm wondering what is the position on the topic from the react-strict-dom POV. Should the createStrictImage force it to 0 and let the optional animation be handled by css transition polyfills?
If not, how can the behavior be overridden? In react-native the fadeDuration property can be used to reset to 0 when needed, but not being a valid web API is not allowed in html.img (as well as possibly creating conflicts with transitions and/or animations)
Activity
MoOx commentedon Jun 2, 2026
Can
compatbe used for this as a workaround ?axyz commentedon Jun 2, 2026
yes, most likely if you have a design system and provide a component library you would have an Image component wrapping the lower level
html.imgand can use.native.tsxfile withcompat.nativeto passfadeDuration = 0But as you mentioned is only a workaround, it means that you would not be able to use
html.imganywhere in cross-platform files and would need to keep track of direct usages (withoutImagewrapper). When those usages happen (and they inevitably will) you would get the surprising behavior of the fade animations that is not defined in any owned style and hidden within this odd default of react-native.Personally I think RSD should "fix" this anomaly even if it conflicts with RN, in a way is similar to normalizing flex behavior and all the other defaults that conflict with RN in order to get closer to web specs.
bencripps commentedon Sep 4, 2026
This has been opened for a while, and I think the suggested fix here makes sense. Opened PR.