#Qwik Img Tag Srcset

15 messages · Page 1 of 1 (latest)

wraith vector
#

I recently explored Qwik for web application development, seeking an alternative to the prevalent but inefficient hydration-based methods. Qwik appears to be a highly effective approach, though it does have a notable learning curve, especially when it comes to writing performant code.

I'm facing a specific challenge: my limited knowledge in creating srcsets for images. My current yaml file setup is quite basic. I could provide the code if needed. In my research, I found that Cloudflare effectively addresses this issue, but I'm curious if there's an existing solution within the Node Package Manager ecosystem. This discovery could enable a GitHub Pages workflow, significantly reducing the deployment costs for Qwik-based webpages.

Is this an area where I should focus my efforts to contribute to the Qwik development project? Has this problem already been tackled in the npm community? I'm keen on learning and contributing to the promotion and enhancement of Qwik. Additionally, I'd like to know if the General conversation channel is open to newcomers for learning and interaction with the team. Thank you for your time and insights.

#

@shell pollen I will address this message to you because your work with Qwik seems to provide you elevated status in this Discord. It makes me assume you are most aware of the culture here in the Discord and may be aware of the questions I have regarding img tag srcset generation and the expectation surrounding how the community uses the General chat. Thank you for your time. I am certain you are busy at the moment, but I appreciate your advice when you have time to address my message and questions.

#

#842438761287254020 message

#

@shell pollen I am going to test it in my deployment tonight, thank you

proud cipher
#

If you need help or have questions the #1046929728948408370 is the place for you. Not only will your question not be drowned out by general chatter, it's also easier to find it again, both for you and for the community. As well as helping people who might have had similar issues to you. I'd say the general chat is just for chatting about anything, if you ask questions there expect it not to be answered or very limited reply. Maybe limit your questions there to yes/no type questions.

As for your problem, sorry I've never used a src set so I have no idea what issues there might be related to that in combination with qwik. You might wanna take a look at the documentation if you haven't already.

warm pebble
#

As per understanding srcset & sizes can't be automated & optimized at the same time.

#

For example in my recent project I had to analyze the design on diffrent views (mobile, tab, laptop, desktop) and differ srcset values according to their media queries.

#

And it is very cumbersome to manage that using raw string with srcset attribute. For that reason I've created my own Image component which handles that.

#

This screenshot can give you some understanding of what you need to do.

image.png
#

The resolutions prop will be converted to the srcset attribute in html. And the sizes attribute what you need to tinker with and differ values according to your design with different media queries.

wraith vector
#

@warm pebble
Couldn't we create a method that utilizes the Central Limit Theorem to optimize both parameters within an acceptable delta, based on the available media in the industry?
Before 2015, I would have been really apprehensive about a project like this.
However, I believe GPT models are capable of performing this higher level of dynamic mathematics without the need for supervision or intervention. We could even have the agent assess the results in a test environment using tools like GitHub Pages, Cloudflare, etc.

frosty quartz
warm pebble
frosty quartz
#

:D<