fix: nuxtpicture placeholder

[acvigue]

Closes #1160.

Adds placeholder behavior to NuxtPicture by initially setting the img element's src tag to the placeholder, waiting for the main src to load, and then showing the image.

[codecov-commenter]

Codecov Report

Attention: Patch coverage is 94.33962% with 3 lines in your changes missing coverage. Please review.

Project coverage is 62.44%. Comparing base (4efdc0b) to head (b0a6bb3).

Files	Patch %	Lines
src/runtime/components/_base.ts	89.28%	3 Missing ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #1396      +/-   ##
==========================================
+ Coverage   62.20%   62.44%   +0.23%     
==========================================
  Files          79       79              
  Lines        3593     3605      +12     
  Branches      391      401      +10     
==========================================
+ Hits         2235     2251      +16     
+ Misses       1328     1324       -4     
  Partials       30       30              

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

[danielroe]

I'm a bit worried that we end up loading more images than necessary. So, mainSrc will load, but then if there is another src that better suits browser needs (e.g. avif/webp), this will swap in, and we will have downloaded twice as much image data as we need.

do you have any ideas for resolving that? maybe using a picture element as placeholder instead?