Prismic Image imgix urls not encoded, breaks inside picture source element. Also Prismic Server results are not compressed/gzipped

[harrisonifeanyichukw (Harrison Ifeanyichukwu)]

Hello guys, I am here again, with another banger . Prismic sends image URLs without being encoded. We know that Imgix uses commas to separate image scale parameters, but then, prismic does not encode these characters.

When you use it inside a picture source element, as the srcSet, the browser misunderstands the URL since commas are used to specify image density and width parameters. Oh well, the end-user can do this encoding right in the browser, but this can slow down the website.

I don't know if I am explaining this correctly, but you should understand.

Expected behaviour:
Prismic should encode all image URLs in the returned results to avoid misrepresentations.

Another side note, Prismic servers should support gzip encoding to save bandwidths. It is not good that graphql results are not compressed/gzipped. this is very important

Thanks

[Fares]

Hi Harrison,

Thanks for contributing to the Prismic community.

I totally understand your requests and I have created an enhancement ticket in our issue tracker and we will let you know in case of any updates,

Fares

[ryan (Ryan Lonac)]

Hey Fares,

for the short term, if you can specify a media attribute on the browsers should respect the srcset.

I booted up a project in development that has 4 crops specced in the document. Using the media attribute allows the images to change.

This might help for now

e.g.

<source :srcset="field.image.square.url" media="(min-width: 1200px)" />

where field is the local var of our slice being rendered in vue/nuxt.

This produces a srcset with commas, but Chrome successfully swaps from the landscape version to the square version.

[Fares]

Thanks for letting us know, anyway an issue has been created regarding this.