Image sizes in block preview?

Kirby 3 Questions 🤔
1

Hi,
for a media gallery page I created a custom block with a bunch of images. Since these are ready for print, the sizes are quite big. Is there a way to not use the full size images in the vue preview? I tried

<img v-if="item.image[0]" :src="item.image[0].crop(200,300).url">

but it did not work, since “item.image[0].crop() is not a function”.
Is there any other method I can use here to make the page less heavy? Currently it needs to load over 100mb of images when editing the page in question.
Thanks a lot!

2

Crop() is a PHP function, rather than Javascript. As far as I know, you would need to make a custom API end point with and hit that from javascript, so that PHP does the cropping and just sends the resulting URL through to the block.