{{ $class := .class }}
{{ $alt := .alt }}
{{ $noscriptSupport := .noscript }}
{{ $imgDict := .imgDict }}
{{ if $noscriptSupport }}
<noscript>
    <!-- TODO: add responsiveness -->
    <img src="{{ $imgDict.default.Permalink }}" {{ with $alt }} alt="{{ . }}" {{ end -}} 
    class="{{ $class }}" loading="lazy" 
    {{- with $imgDict.default }} height="{{ .Height }}" width="{{ .Width }}" {{ end -}}>
</noscript>
{{ end }}
<img 
{{- with $imgDict.lqip -}}
    {{- $placeholderB64 := .Content | base64Encode -}}
    {{- if gt (len $placeholderB64) 2048 }}
        src="{{ .Permalink }}"
    {{- else }}
        src="data:{{ .MediaType }};base64,{{ $placeholderB64 }}"
    {{- end }}
    data-src="{{ $imgDict.default.Permalink }}" 
    class="{{ with $class }}{{ . }} {{ end }}blur-up lazyload" 
{{ else }}
    src="{{ $imgDict.default.Permalink }}" class="{{ $class }} lazyload" 
{{- end -}}
{{- with (default $imgDict.default $imgDict.lqip) }} height="{{ .Height }}" width="{{ .Width }}" {{- end -}}
{{- if $imgDict.responsive -}}{{ with partial "renderer/_srcset" $imgDict }} data-sizes="auto" data-srcset="{{ . }}" {{- end }}{{- end -}}
{{- with $alt }} alt="{{ . }}" {{- end }}>