Output nested tags with one single ViewHelper - typo3

Question

I have a TYPO3 project with an extension using Extbase and to implement lazy loading and retina images while maintaining compatibility if javascript is disabled, I need to generate some output like this:
<noscript data-src-small="small.jpg" data-src-large="large.jpg" data-width="300" data-height="200">
<img src="small.jpg" width="300" height="200">
</noscript>
So I wrote a custom ViewHelper (or rather I copied and modified an existing one) that does exactly this and it works, but I'm not sure I'm doing it right, because I'm manually creating the <img> like this:
$content = '<img class="'.$class.'" alt=" " src="'.$imageSource.'" width="'.$imageInfo[0].'" height="'.$imageInfo[1].'">';
$this->tag->setContent($content);
I wonder if there isn't a better way to do this, ideally I'd like to call the standard ImageViewHelper::render() function inside my custom ViewHelper.
Is there any way to do that? Should that even be done at all?
I am aware, I could adjust my template like this:
<x:noscript src="filename.jpg" width="300">
<f:image src="filename.jpg" width="300" />
</x:noscript>
(x:noscriptis supposed to be my custom ViewHelper)
and call renderChildren() inside my ViewHelper.
But then I would have to repeat src="filename.jpg" width="300" and I generally don't like to repeat input if there's a better way.

Answer 1

The easiest way to achieve what you want is to use a partial. It would look like this:
{namespace x=Yourcompany\Yourproduct\ViewHelpers}
<f:comment>
Parameters:
* src: src of the image
* width: Width of the image
</f:comment>
<x:noscript src="{src}" width="{width}">
<f:image src="{src}" width="{width}" />
</x:noscript>
You can use it like this:
<f:render
partial="Path/To/Partial"
arguments="{width: 300, src: 'filename.jpg'}
/>