howdytom

@taotoo, @bernhard, @Jan Romero Thanks for your clarification. Regarding 300dpi file size I was wrong. I did experience this kind of slowness and high CPU usage with a client project that I recently migrated. It turned out the previous owner did not define any image scaling. They used to export 300dpi files from Indesign with 20MB file sizes and users uploaded multiple images to the ProcessWire project. Approx. 100MB were loaded on every page refresh. After taking a closer look I managed to resolve the issue. Thanks again.

You are right. 72dpi or 96dpi files do not matter. I do not see any difference choosing between client-or server-side resize. I am using a max width and height dimension. PW scales and compresses the original image from 7MB to 916KB. However the dpi a remains untouched. 300 dpi images cause bigger file size, bigger network payload with long load times. The CPU usage is noticeable higher instead of using 72/96 dpi files.

How can I globally limit the max. dpi image size in ProcessWire? I have set max width and height for uploaded images and I also added a description with additional information. The image field is cropped and scaled in various sizes. However the image dpi remains untouched. Some users still managed to upload large 300dpi images, which causes massive server CPU spikes on every page reload. I tried to teach those users, but they simply don't care. 300dpi images should not be uploaded to PW in the first place. What is the best option to prevent users from uploading 300dpi images? What is your recommendation?

@dynweb Thank you. perfect! Issue solved

Thank you. This is exactly what I was looking for! ...Way better UI experience

Did you enable any PHP caching on your server?

Using PNG compression for pictures might generate large files. Even with your black gradient try to export the original image as JPEG instead. The file size should be considerable smaller for all variations including webP files.

My site paragraph format are barely readable and always cut off. How can I adjust the width for drop down? I tried to overwrite editor.css from the CKEditor moono-lisa skin by coping it to sites/modules/InputfieldCKEditor/ckeditor-4.19.0/skins/moono-lisa/editor.css .cke_combo__format .cke_combo_text { width: 275px !important; } However it doesn't work. This is not a solid solution due to changes or updates to CKEditor. width: auto; would be much better. What is the right way to fix the format width?

Wow, This bug has been fixed with PW 3.0.200 !! ? ? @ryanThank you so much.

Done. Thank you for your reply. Hopefully there will be a solution.

Thanks for getting back to this issue. So far I did not find a solution. When I select and delete all or single variations, WebP files remain in the asset directory. This issue occurs with RepeaterMatrix and also in single PW image field. I think it is a ProccessWire bug? ?‍♂️

@Adam Thank you for your in-depth reply. Perfect. That is a solid solution, even though I have never experienced any issue with your TfaU2F and TfaWebAuthn module and 3 Yubikeys. I do prefer the native ProcessWire way :-)

@Adam Webauthn is way more responsive. I like the native browser support! There is one feature request I have asked before. How do I disable TfaWebAuthn through the database? How can I gain access in case something goes wrong e.g. PHP incompatibility or PW version issues? A quick tutorial would be useful. Does Webauthn provide additional recover options?

@Adam, That is fantastic! I gave TfaWebAuthn 1.0.0 a try. I am using your module on 3 ProcessWire sites. This was such an easy and seamless transition! I have successfully added two Yubikeys. It took less than 1 minute to setup. What I noticed is that the authentication process is much faster using Yubikey. Excellent piece of work! Thank you so much for providing a solution before February.

Thanks for bringing this up. I am using FIDO Authentication on all my PW sites too.

@horst, thanks. I gave dev version 3.0.183 and RepeaterMatrix v5 a try. ✅ Deleting the JPG/PNG variations will delete all files within /assets/files/1134/. ❌ Deleting the webP variations will remove them from the variants list, however all files still remain in the /assets/files/1134/ directory. Maybe I am missed something in my RepeaterMatrix code. My markup code: <?php if(count($page->img_test)) { foreach($page->img_test as $image){ $imgsettings = array( 'quality' => 80, 'cropping' => 'southeast' ); $img_1920 = $image->size(1920, 1080, $imgsettings); $img_1600 = $image->size(1600, 0, $imgsettings); $img_500 = $image->size(500, 0, $imgsettings); echo " <picture> <source srcset='{$img_1920->webp->url}' loading='lazy' type='image/webp' alt='{$img_1920->description}' sizes='100vw' srcset='{$img_500->webp->url} 500w, {$img_1600->webp->url} 1600w, {$img_1920->webp->url} 1920w' class='canvas__fullsize-img'> <source srcset='{$img_1920->url}' loading='lazy' type='image/{$image->ext}' alt='{$img_1920->description}' sizes='100vw' srcset='{$img_500->url} 500w, {$img_1600->url} 1600w, {$img_1920->url} 1920w' class='canvas__fullsize-img'> <img src='{$img_1920->url}' loading='lazy' alt='{$img_1920->description}' sizes='100vw' srcset='{$img_500->url} 500w, {$img_1600->url} 1600w, {$img_1920->url} 1920w'> </picture>"; } }

@horst Thanks, I updated my question. Hopefully it makes sense.

@Adam Thanks for your speedy reply. Could you provide a tutorial which database table needs to be modified to manually disable TFA module? I did not find any option under 'field_roles'.

Hi there, When I delete all image variants, ProcessWire does not remove previously generated webP files from the assets/files folder. The variants list is empty. PNG and jpeg images are removed just fine, but webP files are left on the server. This will increase dramatically disk space on bigger projects. How can I automatically clean up webP leftovers on deletion? Steps to reproduce: I am using a ProFields:repeater Matrix with a FieldtypeImage. webP variations are created with $img_1920->webp->url, $img_1600->webp->url ... in a <picture> element. 1. Within the repeater image field, → Variations → Delete checked → close the modal → Save 2. When I go to assets/files/1134/ all png variations are deleted. webP variations are still kept e.g. testgrafik-logodesign.1600x0se.webp, testgrafik-logodesign.1920x1080se.webp 3. When I open again the variations modal → the variation list is still empty, except the original file. 4. However deleting the repeater Item, will also remove all files from assets/files directory. ProcessWire 3.0.165

Adam, Thank you for this fantastic module. It works great with PW 3.0.165 and Yubiykeys. Some additional thoughts: I added three Yubikeys. In case of loss, how can I revoke one specific Yubikey? It looks like I have to turn off U2F and deactivate all keys. Then re-add all YubiKeys again, right? How can I recover access due to PHP incompatibility or PW version issues? Can I remove TfaU2F from the site/modules directory? Feature Request: You should add some highlighting when a new security key has been added. The confirmation changes so quickly and could be easily missed. A summary with all active keys and description field would be great. Excellent work!

I do have a follow-up question: Why is PHP GD and Imagick creation so slow when calling the frontend page? I have to add a lot of images to a PW project. When I add 2 images with 500kb file size, it takes almost 30 seconds to generate 8 WebP/JPEG variations. The Image-sizer log looks good to me: 2021-08-16 14:16:19 username /projekte/corporate-design-test… IMagick Resized: testimage.jpg => testimage.800x0se.jpg (800x0) 1.4486 secs 516332 => 78717 bytes (quality=75, sharpening=soft) 1 hour ago 2021-08-16 14:16:17 username /projekte/corporate-design-test… IMagick Resized: testimage.jpg => testimage.500x0se.jpg (500x0) 0.8468 secs 516332 => 37217 bytes (quality=75, sharpening=soft) 1 hour ago 2021-08-16 14:16:17 username /projekte/corporate-design-test… IMagick Resized: testimage.jpg => testimage.1920x1080se.jpg (1920x1080) 4.7528 secs 516332 => 307819 bytes (quality=75, sharpening=soft) Update: I have tested the site on a production server and image variants are created much faster than in MAMP.

@horst Thank you for your reply. Solution: It turned out I set PHP mode to CGI to use to a different PHP version for every host. It looks like PHP mode CGI uses its own execution time and has additional limitation. Although max_execution_time 300 is set in php.ini it is somehow ignored. Now, with PHP Module mode, I am able to add 50 images without any 500 error. ! :-)

@netcarver Thanks. PW Error/Exception logs are empty. Once I hit reload, the Image-sizer log looks good to me. IMagick Resized: 1_portfoliologo.png => 1_portfoliologo.1500x0se.png (1500x0) 2.7099 secs 31021 => 49210 bytes (quality=75, sharpening=soft) I have enabled PHP/Apache debug log. But there are no error message besides [client ::1:51180] AH01964: Connection to child 11 established (server ___default___:443) [core:debug] [pid 1456] protocol.c(2338): [client ::1:51180] AH03155: select protocol from , choices=h2,http/1.1 for server pw-portfolio [ssl:debug] [pid 1456] ssl_engine_kernel.c(2351): [client ::1:51180] AH02043: SSL virtual host for servername pw-portfolio found [ssl:debug] [pid 1455] ssl_engine_kernel.c(2231): [client ::1:51179] AH02041: Protocol: TLSv1.2, Cipher: ECDHE-RSA-AES128-GCM-SHA256 (128/128 bits) [Sun Aug 15 22:14:47.614382 2021] [ssl:info] [pid 1456] Update: I have removed the webP properties from the image fields. However I am still getting 500 Internal Server Error when I add 4-10 files to an image field. Image creating is working fine when I add 1 image, though. It looks like a MAMP specific limitation. Is there anything else I can look up? Not sure how can I debug this further.

Hello, Adding more than 4 images to a repeater image field, Processwire crashes with 500 Internal Server Error. The Image file size is below 500 kb and ~2000px, 72dpi. Refreshing the page multiple times will generate and show the image variants at some point. There is no difference using GD or IMagick Image Sizer. Apache/PHP Logs does not show any errors. MAMP is set to 1024M memory_limit, max_execution_time 300 and upload_max_filesize 50MB. I guess this should be more than enough? Is this a PW or MAMP Pro issue? Any advised what is causing the Internal Server Error? Image Fieldtype settings: 'quality' => 75, 'upscaling' => true, 'cropping' => 'southeast' 4 JPEG image dimensions: 1920px, 1500px, 800px, 500px 4 webP image dimensions: 1920px, 1500px, 800px, 500px ProcessWire 3.0.165 MAMP Pro 6.4.2 Apache2.4 PHP7.4.16 I really appreciate any replies.

That is a great and question. I do not know any European companion compared to Vimeo or YouTube. Most services are based on AWS or Akamai CDN. Vimeo ships with excellent customisation options and a great UI. To be honest, I have not used it so far. Usually I am hosting video files myself and preload the mp4 and webM files. In terms of playback performance and bandwidth, I have never experienced major slowness. Even with higher bitrates and scrubbing through the video, the playback is great on most recent devices. Todays smartphones are soo powerful. Using crippled shared servers could lead to slow progressive downloads, though. If you are looking for a full featured SasS video compression, Vimeo's and YouTube pricing and customisations are unbeatable. Otherwise you have to spend some time on tweaking the video compression before uploading. I guess this is not the answer you were looking for. ?