Frontend code often needs to open new pages. Here is a summary of methods and issues encountered.
Methods
- Anchor tag
- window.open
window gives finer control, such as width and height. For anchor tags, you need to create a DOM element and decide whether it is visible. Anchor tags are generally preferred because they represent user-driven interactions.
Behavior in PWA
A PWA is just a presentation mode for web pages. If you open a new page in a PWA, the behavior differs:
- Anchor tags open in the traditional browser UI.
- window.open follows the PWA display mode. For example, if the PWA uses standalone, the new window also uses standalone.
In my opinion, in PWAs you should use location.href rather than opening a new tab. Try to keep an app-like experience.
