Code Monkey home page Code Monkey logo

Comments (6)

JannikZed avatar JannikZed commented on June 14, 2024 7

Hi there, we would really need to use the responsive loader with webp images, as they are the new web-image standard! This issue is open since 2017 - is there any chance we can realize this functionality fast and easy? What is currently blocking?

from responsive-loader.

blowsie avatar blowsie commented on June 14, 2024 6

Hi @herrstucki , since Sharp supports webp, what work would need to be done get get responsive-loader to support wepb with sharp? How can I help / develop this feature?

from responsive-loader.

dazuaz avatar dazuaz commented on June 14, 2024 2

webp support added!

from responsive-loader.

jstcki avatar jstcki commented on June 14, 2024 1

Good idea! I'd be happy to accept a PR adding this feature 👍

The only concern I have would be that jimp doesn't support webp yet, so we'd need to handle that accordingly.

from responsive-loader.

strarsis avatar strarsis commented on June 14, 2024

@herrstucki: Is there an "official" fork of this repository so I can also have webp support?

from responsive-loader.

kopax avatar kopax commented on June 14, 2024

Hi and thanks for adding the feature, is there a way to enable ?format=webp by default for all imports ? I tried using the adapter configuration format but then I have no more jpeg for all browsers, this is what I expect in the end:

    <source type="image/webp" srcset="2700x1209/rocket-pods-mr-ben-01-2700x1209.webp 2700w, 
                    1800x806/rocket-pods-mr-ben-01-1800x806.webp 1800w, 
                    1536x1536/rocket-pods-mr-ben-01-1536x1536.webp 1536w, 
                    1024x1024/rocket-pods-mr-ben-01-1024x1024.webp 1024w, 
                    900x900/rocket-pods-mr-ben-01-900x900.webp 900w, 
                    600x600/rocket-pods-mr-ben-01-600x600.webp 600w" 
            sizes="100vw" />
    <source srcset="2700x1209/rocket-pods-mr-ben-01-2700x1209.jpg 2700w, 
                    1800x806/rocket-pods-mr-ben-01-1800x806.jpg 1800w, 
                    1536x1536/rocket-pods-mr-ben-01-1536x1536.jpg 1536w, 
                    1024x1024/rocket-pods-mr-ben-01-1024x1024.jpg 1024w, 
                    900x900/rocket-pods-mr-ben-01-900x900.jpg 900w, 
                    600x600/rocket-pods-mr-ben-01-600x600.jpg 600w" 
            sizes="100vw" />

Note: there is two source set.

from responsive-loader.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.