Improve performance of CollectionView with bunch of images Grid
See original GitHub issuePoor performance scroll with CollectionView of grid images(images > 400) Second Point: Each time that updateCell() occur i need to put the scaleMode to the image because they loose it despite the fact that I did it at the creation of the images. How can i have a great performance with CollectionView TabrisJs 3.0.0Beta2 Android 8
const {contentView,CollectionView,ImageView,Composite} = require('tabris');
const imagesPath = [{imagePath:'https://i.imgur.com/TCtLXpZ.jpg'},{imagePath:'https://i.imgur.com/mv8YkiP.jpg'},{imagePath:'https://i.imgur.com/sdXEBRl.jpg'},{imagePath:'https://drscdn.500px.org/photo/158789295/m%3D900_s%3D1_k%3D1_a%3D1/v2?webp=true&v=3&sig=4bd95aa2cbed8d94e29e9500ea545296b2001ffc70b59f515d187d9ad4ad42e9'},{imagePath:'https://drscdn.500px.org/photo/143776291/m%3D900_s%3D1_k%3D1_a%3D1/v2?webp=true&v=9&sig=738d4eefd84eb9f38940ba7742fb9c24215f0be8cd87fc8b4236f4b13d092fb1'},{imagePath:'https://sm.ign.com/ign_fr/news/c/captain-ma/captain-marvel-first-reactions-twitter-roundup_tse9.jpg'},{imagePath:'https://cdn-images-1.medium.com/max/2400/1*kqt8WntffBYIXRRzGCXWJg.png'},{imagePath:'http://www.maximumwall.com/wp-content/uploads/2017/01/wallpaper-image-compilation-janvier-2017-13-660x330.jpg'},{imagePath:'https://besthqwallpapers.com/Uploads/20-3-2018/44999/thumb2-green-abstraction-geometric-background-material-design-android-google.jpg'},{imagePath:'http://cdn.osxdaily.com/wp-content/uploads/2017/06/ios-11-default-wallpaper.jpg'},{imagePath:'https://boygeniusreport.files.wordpress.com/2018/11/iphone-xs-eraser-wallpaper.jpg'},{imagePath:'https://static.businessinsider.com/image/541acae669bedd94052c5ca4-750.jpg'},{imagePath:'http://getwallpapers.com/wallpaper/full/3/4/8/125042.jpg'},{imagePath:'https://www.iphoned.nl/wp-content/uploads/2018/07/ios-wallpapers1-580x375.jpg'},{imagePath:'https://www.setaswall.com/wp-content/uploads/2017/03/iOS10-stock-wallpaper-005.jpg'},{imagePath:'https://media.idownloadblog.com/wp-content/uploads/2018/11/iPad-Pro-11-advertising-wallpaper-3-light-blue.jpg'},{imagePath:'http://images6.fanpop.com/image/photos/41500000/Betta-Fish-betta-fish-41537774-1920-1080.png'}];
new CollectionView({layoutData:'fill',itemCount:imagesPath.length,columnCount:2,cellHeight:Number(screen.width / 2),
createCell: () => {
const cell = new Composite({width:Number(screen.width / 2),height:Number(screen.width / 2)});
new ImageView({scaleMode:'fill',width:Number(screen.width / 2),height:Number(screen.width / 2),id:'userPicture'}).appendTo(cell);
return cell;
},updateCell: (cell,index) => {
const picture = cell.find('#userPicture')[0];
picture.image = imagesPath[index].imagePath;
}
}).on('select', ({target,index}) =>{
console.log(imagesPath[index].imagePath);
}).appendTo(contentView);
Issue Analytics
- State:
- Created 4 years ago
- Comments:29 (14 by maintainers)
Top Results From Across the Web
How to improve performance of UCollectionView containing ...
How to improve performance of UCollectionView containing lots of small images? · Consider different screen sizes and orientations. · The small images can...
Read more >Increase performance of CollectionView using Grid ... - MSDN
Problem: With one or two columns it works just fine. With 5-6 columns the performance is not like it should be, even if...
Read more >Downsampling images for better memory consumption and ...
Downsampling images for better memory consumption and UICollectionView performance · 1. Load compressed image data to memory. · 2. Convert ...
Read more >Make your life simpler with the CollectionView's Layouts
CollectionView allows us display a list of data. It's very similar to the ListView but this control enhances the performance and memory management...
Read more >Improve scroll performance for grids of images. #857 - GitHub
Reproduce. Create rows of images inside a collection view and scroll around. There's a noticeable stutter. Other Comment. What I've done to ...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
The design of
TextInput
s has changed. You should refer to the docs for more information.All of this is much beyond the original issue with a
CollectionView
.Thank you