vnbaaij / ImageProcessor.Web.Episerver

Integrate ImageProcessor into Episerver and use it in your views with a fluent API. For Editor integration do not use ImageProcessor.Web.Episerver.UI but instead use ImageProcessor.Web.Episerver.UI.Blocks. For more information see
http://world.episerver.com/blogs/vincent-baaij/dates/2017/10/episerver-and-imageprocessor-more-choice-for-developers-and-designers/
MIT License
20 stars 9 forks source link

cropping large size images #12

Closed wiske80 closed 6 years ago

wiske80 commented 6 years ago

Hi Vincent,

we experience some performance issues when we have a mega size image 4200x2800 (8MB) for example; http://inte.hyvacareer.com/siteassets/brazil.jpg

that opens fast...

but when trying to crop it: http://inte.hyvacareer.com/siteassets/brazil.jpg?width=1900&height=800&mode=crop

it really has problems doing so. Takes a long time and then just stops and no image.

With smaller size images i don't experience this. I hope you can replicate this aswell. Again this is on DXC azure blobstorage.

regards, Vishal

vnbaaij commented 6 years ago

Hi Vishal,

Can you try it on a plain Image Processor site, so without Episerver in between.

Met vriendelijke groet,

Vincent Baaij Egmondland 28 2635MW Den Hoorn 06 421 412 28


From: Vishal Panday notifications@github.com Sent: Wednesday, September 12, 2018 6:03:30 PM To: vnbaaij/ImageProcessor.Web.Episerver Cc: Subscribed Subject: [vnbaaij/ImageProcessor.Web.Episerver] cropping large size images (#12)

Hi Vincent,

we experience some performance issues when we have a mega size image 4200x2800 for example; http://inte.hyvacareer.com/siteassets/brazil.jpg

that opens fast...

but when trying to crop it: http://inte.hyvacareer.com/siteassets/brazil.jpg?width=1900&height=800&mode=crop

it really has problems doing so. Takes a long time and then just stops and no image.

With smaller size images i don't experience this. I hope you can replicate this aswell. Again this is on DXC azure blobstorage.

regards, Vishal

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHubhttps://github.com/vnbaaij/ImageProcessor.Web.Episerver/issues/12, or mute the threadhttps://github.com/notifications/unsubscribe-auth/ABrfNy_mwIexxsgKuoxsnjF-dKrMKohPks5uaTBSgaJpZM4WltGq.

wiske80 commented 6 years ago

Hi Vincent,

then it works good. Also locally (diskstorage) it works without a problem (with episerver in between).. It looks like the problem has to do with imageprocessor and the CDN the DXC uses...

This is a pre-production machine on DXC and as you can see it take a lot of time for the images to load as well. http://prep.hyvacareer.com/en/about/
And if you try to open the imageprocessor link of images (with querystring params) you see that whatever you add as the size it just breaks. http://prep.hyvacareer.com/siteassets/brazil-small.jpg?width=900&height=800&mode=crop

I dont know if there are other settings for optimal workings with the Cloudflare CDN that EPi uses for its DXC. I have a ticket running as well at Epi for helping out, https://support.episerver.com/hc/en-us/requests/198584

But now i'm so lost in all this as there so many components in play that i don't really know where to start.

P.S in the normal ImageProcessor there were extra settings for the cache.config file for example: But i remember that those were not necessary for the episerver variant of the package. Thats still true right?

`<?xml version="1.0" encoding="utf-8"?>

`
vnbaaij commented 6 years ago

Hi,

Will take a look at this soon. Will probably not be able to do that this week.

Vincent


From: Vishal Panday notifications@github.com Sent: Monday, September 17, 2018 10:09:16 AM To: vnbaaij/ImageProcessor.Web.Episerver Cc: Vincent Baaij; Comment Subject: Re: [vnbaaij/ImageProcessor.Web.Episerver] cropping large size images (#12)

Hi Vincent,

then it works good. Also locally (diskstorage) it works without a problem (with episerver in between).. It looks like the problem has to do with imageprocessor and the CDN the DXC uses...

This is a pre-production machine on DXC and as you can see it take a lot of time for the images to load as well. http://prep.hyvacareer.com/en/about/ And if you try to open the imageprocessor link of images (with querystring params) you see that whatever you add as the size it just breaks.

I dont know if there are other settings for optimal workings with the Cloudflare CDN that EPi uses for its DXC. I have a ticket running as well at Epi for helping out, https://support.episerver.com/hc/en-us/requests/198584

But now i'm so lost in all this as there so many components in play that i don't really know where to start.

— You are receiving this because you commented. Reply to this email directly, view it on GitHubhttps://github.com/vnbaaij/ImageProcessor.Web.Episerver/issues/12#issuecomment-421922032, or mute the threadhttps://github.com/notifications/unsubscribe-auth/ABrfN8RueWuXuUl-tc310vNSGHucAkCaks5ub1isgaJpZM4WltGq.

wiske80 commented 6 years ago

Thanks Vincent,

but just a quick question.. is there a setting to not store the cache files in the (DXC) blob container but store those on disk /app_data/ for example?

If yes what are the correct settings to do that. I want to see if that helps my problems, because on umbraco for example it seems that storing and fetching cache files from blob are a performance problem.

On monday we have a golive so i hope to hear from you if this is possible.

vnbaaij commented 6 years ago

Hi,

Sorry, but there is no setting to override storagelocation

vnbaaij commented 6 years ago

Just tested with this image on my Azure test environment and no problems there (http://ipepiservertest.azurewebsites.net/globalassets/brazil-small.jpg?width=200) Are there any size restrictions in the config files?

wiske80 commented 6 years ago

Hi Vincent,

these problems i heard were discussed with you last Friday by Vikas from Epi regarding some header errors he saw in the logs. Can you see all communication in epi ticket below? https://support.episerver.com/hc/en-us/requests/198584

I think its all related to that ticket..

vnbaaij commented 6 years ago

2 things: 1) I don't have access to that ticket, but have indeed been contacted by Vikas. He mailed me the error message 2) I don't get those errors in my test environment. This makes it very hard for me to debug this problem. Don't really know what I can do for you.

wiske80 commented 6 years ago

I think the problem is related to the DXC environment in combination with the CDN EPi uses..

They tried a url outside of the CDN and then everything works fine. (he said), but because of EPI security policy i cannot get that url etc.

So i think you are not using the CDN as well, and so dont experience problems.

wiske80 commented 6 years ago

Some more information with screenshots from Azure insights. We get lots of 404 and HTTPExceptions.

breaking it down: In screenshot you see its trying to fetch cache file 3p!_2c2659a40aee500d61c34de507b15943f0b88f95.jpg from folder '0a6fbfdee54b4443ae10d369d7ae5bc7' but looking into Azure explorer you see that the file is not even created. (i think because of the CDN in between, but cannot be certain).

So it gives the error that it cannot fetch anything.

The lots of error in insights are the same thing.

System.Web.HttpException: at System.Web.HttpResponse.AppendHeader (System.Web, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a) at ImageProcessor.Web.HttpModules.ImageProcessingModule.SetHeaders (ImageProcessor.Web, Version=4.9.1.2, Culture=neutral, PublicKeyToken=null) at ImageProcessor.Web.HttpModules.ImageProcessingModule.SetHeaders (ImageProcessor.Web, Version=4.9.1.2, Culture=neutral, PublicKeyToken=null) at ImageProcessor.Web.HttpModules.ImageProcessingModule.PostReleaseRequestState (ImageProcessor.Web, Version=4.9.1.2, Culture=neutral, PublicKeyToken=null) at System.Web.HttpApplication+SyncEventExecutionStep.System.Web.HttpApplication.IExecutionStep.Execute (System.Web, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a) at System.Web.HttpApplication.ExecuteStepImpl (System.Web, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a) at System.Web.HttpApplication.ExecuteStep (System.Web, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a)

insights insights2 insights3 explorer

vnbaaij commented 6 years ago

Vishal,

Must be CDN indeed. I'm not using that on my demo environment and I don't have access to an environment that does work with CDN (I. E. A DXC service instance) I'll ask around internally if there is some way to create a test setup for this.


From: Vishal Panday notifications@github.com Sent: Tuesday, September 25, 2018 4:08:53 PM To: vnbaaij/ImageProcessor.Web.Episerver Cc: Vincent Baaij; Comment Subject: Re: [vnbaaij/ImageProcessor.Web.Episerver] cropping large size images (#12)

Some more information with screenshots from Azure insights. We get lots of 404 and HTTPExceptions.

breaking it down: In screenshot you see its trying to fetch cache file 3p!_2c2659a40aee500d61c34de507b15943f0b88f95.jpg from folder '0a6fbfdee54b4443ae10d369d7ae5bc7' but looking into Azure explorer you see that the file is not even created. (i think because of the CDN in between, but cannot be certain).

So it gives the error that it cannot fetch anything.

The lots of error in insights are the same thing.

System.Web.HttpException: at System.Web.HttpResponse.AppendHeader (System.Web, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a) at ImageProcessor.Web.HttpModules.ImageProcessingModule.SetHeaders (ImageProcessor.Web, Version=4.9.1.2, Culture=neutral, PublicKeyToken=null) at ImageProcessor.Web.HttpModules.ImageProcessingModule.SetHeaders (ImageProcessor.Web, Version=4.9.1.2, Culture=neutral, PublicKeyToken=null) at ImageProcessor.Web.HttpModules.ImageProcessingModule.PostReleaseRequestState (ImageProcessor.Web, Version=4.9.1.2, Culture=neutral, PublicKeyToken=null) at System.Web.HttpApplication+SyncEventExecutionStep.System.Web.HttpApplication.IExecutionStep.Execute (System.Web, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a) at System.Web.HttpApplication.ExecuteStepImpl (System.Web, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a) at System.Web.HttpApplication.ExecuteStep (System.Web, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a)

[insights]https://user-images.githubusercontent.com/7689723/46019521-84e8fd80-c0dc-11e8-8fc1-4cb3cd1ee146.JPG [insights2]https://user-images.githubusercontent.com/7689723/46019522-85819400-c0dc-11e8-9edf-bc83f098b550.JPG [insights3]https://user-images.githubusercontent.com/7689723/46019524-85819400-c0dc-11e8-9988-00733f7685bc.JPG [explorer]https://user-images.githubusercontent.com/7689723/46019525-85819400-c0dc-11e8-99c7-72b5936b6114.JPG

— You are receiving this because you commented. Reply to this email directly, view it on GitHubhttps://github.com/vnbaaij/ImageProcessor.Web.Episerver/issues/12#issuecomment-424357958, or mute the threadhttps://github.com/notifications/unsubscribe-auth/ABrfN2ovjJ8frDdH4kZqO2lMr8rUKFoPks5uejj1gaJpZM4WltGq.

wiske80 commented 6 years ago

ANy update Vincent?,

isnt is possible you internally use the Hyva blob storage for now for swift action. Create your own folder in that blobstorage? we won't mind :-) I getting kinda desperate as we cannot go live because of this issue and i don't have alternatives (or we have to pay for imageresizer or others)

This is the ideal solution which i have working in other projects without problems, but this is the first on DXC with CDN..

vnbaaij commented 6 years ago

Vishal,

Just spoke to John. Testing on their environment is ok. Please supply me with the logon details etc at my Episerver address

wiske80 commented 6 years ago

Done... thanks