Skip to content

Commit d3d92b9

Browse files
mateoguzmanafacebook-github-bot
authored andcommitted
Unify RNTester Cache Policy Image example (#51580)
Summary: The Image component in Android now supports the same cache control behaviour as in iOS, the examples needed to be separated in the past because the support was not the same for iOS and Android, but now that it is, we can unify the example. ## Changelog: [INTERNAL] - Unify RNTester Cache Policy Image example Pull Request resolved: #51580 Test Plan: <details> <summary>RNTester Screenshots</summary> | iOS | Android | |--------|-------| | ![Simulator Screenshot - iPhone SE (3rd generation) - 2025-05-24 at 12 55 30](https://github.com/user-attachments/assets/f2fd680d-67e4-42db-bc91-f09fe5b0f947) | ![Screenshot_1748084132](https://github.com/user-attachments/assets/ef1b5454-4a85-48d7-be76-3107082b883e) | </details> Reviewed By: yungsters Differential Revision: D75538812 Pulled By: Abbondanzo fbshipit-source-id: 7705c8f824cb18cebc39e84b6f48979035dc104c
1 parent 1e967ca commit d3d92b9

1 file changed

Lines changed: 4 additions & 35 deletions

File tree

packages/rn-tester/js/examples/Image/ImageExample.js

Lines changed: 4 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -595,7 +595,7 @@ const VectorDrawableExample = () => {
595595
);
596596
};
597597

598-
function CacheControlAndroidExample(): React.Node {
598+
function CacheControlExample(): React.Node {
599599
const [reload, setReload] = useState(0);
600600

601601
const onReload = () => {
@@ -1052,46 +1052,15 @@ exports.examples = [
10521052
},
10531053
platform: 'ios',
10541054
},
1055-
{
1056-
title: 'Cache Policy',
1057-
description:
1058-
('First image has never been loaded before and is instructed not to load unless in cache.' +
1059-
'Placeholder image from above will stay. Second image is the same but forced to load regardless of' +
1060-
' local cache state.': string),
1061-
render: function (): React.Node {
1062-
return (
1063-
<View style={styles.horizontal}>
1064-
<Image
1065-
defaultSource={require('../../assets/bunny.png')}
1066-
source={{
1067-
uri: smallImage.uri + '?cacheBust=notinCache' + Date.now(),
1068-
cache: 'only-if-cached',
1069-
}}
1070-
style={styles.base}
1071-
/>
1072-
<Image
1073-
defaultSource={require('../../assets/bunny.png')}
1074-
source={{
1075-
uri: smallImage.uri + '?cacheBust=notinCache' + Date.now(),
1076-
cache: 'reload',
1077-
}}
1078-
style={styles.base}
1079-
/>
1080-
</View>
1081-
);
1082-
},
1083-
platform: 'ios',
1084-
},
10851055
{
10861056
title: 'Cache Policy',
10871057
description: `- First image will be loaded and cached.
10881058
- Second image is the same but will be reloaded if re-rendered as the cache policy is set to reload.
1089-
- Third image will never be loaded as the cache policy is set to only-if-cached and the image has not been loaded before.
1090-
`,
1059+
- Third image will try to load from the cache first and only use the network if the cached version is unavailable.
1060+
- Fourth image will never be loaded as the cache policy is set to only-if-cached and the image has not been loaded before.`,
10911061
render: function (): React.Node {
1092-
return <CacheControlAndroidExample />;
1062+
return <CacheControlExample />;
10931063
},
1094-
platform: 'android',
10951064
},
10961065
{
10971066
title: 'Borders',

0 commit comments

Comments
 (0)