Draft: add width and height for uploaded images in our markdown content (MRs/issues/comments) for reduced layout shifts
Images in our markdown content usually dont have a predefined width or height, which leads to jumping layout while the image is fetched and rendered by the client's browser. This is a suboptimal experience for the user both in direct visits to markdown content (layout shifts), and scroll-to-anchor visits (overscrolled/underscrolled content).
To fix that, we could predefine the width-height pair on the image, so that browser instantly knows the size of the image, and can reserve a certain space for it (according to it's aspect ratio)
<img alt="Title" width="200" height="100" style="max-width: 100%; height: auto;" src="/img.png">Example that won't work, for the markdown doesn't allow it currently
Try applying max-width: 100%; height: auto; to the image below, and it'll be fixed.
Source: <img alt="Gitlab abstract" width="1800" height="1081" style="max-width: 100%; height: auto;" src="/uploads/0df57686f51b2266060f94cf5b03995d/image.png">
The main issue blocking us from this, I think, is the fact that we don't know the sizes of client's images. The very notation  supposes that the image can even change over time.
We can solve most of the use cases by recognising when the image is a static upload, and assign the width/height values to it. Basically all the image drag-n-drop cases should fit into this category. Which, I think, is the majority of cases.
To keep this Markdown-like, we can use these syntax flavours:
- { width: 200px, height: 100px }
- 
Source: https://stackoverflow.com/questions/14675913/changing-image-size-in-markdown
External images would also be able to leverage the syntax above, if users explicitly defines it.
UPD: turns out we already have a syntax for settings width/height through markdown: https://docs.gitlab.com/ee/user/markdown.html#change-the-image-or-video-dimensions (Thanks, @danmh!). All we need is to set it after drag-n-drop, and respect it in preview and via css.