aem image rendition

[sreenu539]

I am using fileupload , pathfield resource types ( see below) wherever I need an image authoring.

Question: Does aem serve best suited image for different devices or does it load same image for all devices  (mobile vs desktop)

If it does use same image for all devices, how could I serve only specific rendition based on device size (mobile vs desktop)

        <file
                                                jcr:primaryType="nt:unstructured"
                                                sling:resourceType="cq/gui/components/authoring/dialog/fileupload"
                                                allowUpload="{Boolean}false"
                                                autoStart="{Boolean}false"
                                                class="cq-droptarget"
                                                fieldLabel="Image Asset"
                                                fileNameParameter="./fileName"
                                                fileReferenceParameter="./fileReference"
                                                isDecorative="{Boolean}true"
                                                mimeTypes="[image/gif,image/jpeg,image/png,image/tiff]"
                                                multiple="{Boolean}false"
                                                name="./file"
                                                title="Upload Image Asset"
                                                uploadUrl="${suffix.path}"
                                                useHTML5="{Boolean}true"/>
                                    

or

                       <fragmentPath
                                                                jcr:primaryType="nt:unstructured"
                                                                sling:resourceType="granite/ui/components/coral/foundation/form/pathfield"
                                                                name="./fragmentPath"
                                                                fieldDescription="Path to the Content Fragment to display."
                                                                fieldLabel="Content Fragment"
                                                                emptyText="Enter or select Content Fragment"
                                                                pickerTitle="Select Content Fragment"
                                                                rootPath="/content/dam"
                                                                required="{Boolean}true"/>
                                 

Thanks,

Sri

[Nitin_laad · Accepted solution]

@sreenu539 Image Presets work like a versatile chef who can prepare a dish in different sizes, with different ingredients, and various accompaniments based on the occasion and preferences. Similarly, Image Presets dynamically deliver images in different sizes, formats, and with other properties that are generated on-the-fly. When exporting images, you can select a preset that reformats the images to meet the specifications set by your administrator.

Refer following links to get more information on your use case - 

Solved: How to get the dynamic renditions of the image? - Adobe Experience League Community - 566367

Renditions | Adobe Experience Manager