[Exported PNG & JPG are blurry]

This. I simply don't understand why Affinity differs from Photoshop in this regard. 

I'm not a professional graphic designer, I just create imagery for my website. I have several pixel dimensions I need to stick with depending on the use of the image (article header, content, product image etc.). In Photoshop I would create the document in the required dimension, create the image, and the export would look clear and crisp (exactly the way it looks while creating it). When I try to do this in Affinity it's always blurry. The image generally looks great within the application, but as soon as you export it the loss of quality is striking.

 

I understand the points made (that vector within the application is loss-less, and that exporting results in a loss of quality due to the fact it needs to be squeezed into pixels), but what I don't understand is why photoshop manages to achieve clear export results while affinity does not. 

 

I love affinity and don't want to return to photoshop, but damn this is annoying. Are there any tutorials for creating sharp web images in png/jpeg at specific px dimensions? Thanks in advance