What are the differences between html preload and prefetch?

Question

Preload and prefetch are both used to request resources in advance so that later resource loading can be quick. It seems that I can interchange the two

Answer 1

rel="preload" loads a resource early for the current document before the body is parsed, potentially saving overall loading time.

As a hint with a lower priority, rel="prefetch" caches a resource for the next navigation after the current document has been loaded.