MicrosoftEdge / MSEdgeExplainers

Home for explainer documents originated by the Microsoft Edge team
Creative Commons Attribution 4.0 International
1.29k stars 205 forks source link

[Side Panel] explain the difference between side panel and just a narrower width window #692

Open npdoty opened 11 months ago

npdoty commented 11 months ago

I couldn't understand from the explainer what the difference was for a web page that it's in the special side-panel mode and a web page that's just narrow width.

Some operating systems allow users to easily tile their windows, including narrow-width windows to one side. Would it be more flexible/extensible to just have web developers recognize that their content is narrow and so it might be good to render in a side-by-side kind of mode?

benjycui commented 10 months ago

Sorry for the late reply.

I had created a PR to update the explainer https://github.com/MicrosoftEdge/MSEdgeExplainers/pull/694/files

That side panel might not provide UX like a browser tab/window is the reason why web page needs side-panel mode , e.g., side panel might not provide omnibox and back/forward button, so web applications need to provide other way to navigate around.

It is recommended to detect windows' width if styles or behaviors are not side panel only.

novac42 commented 6 months ago

To add to @benjycui's comment, a main difference is the context: sidebar PWA has a special UA to inform the app that it's being rendered in a sidebar of a main browser window. Therefore, developer could leverage this to dispatch more lightweight content that fits the sidebar, in that case sidebar PWA serves as a minimalist gateway to extensive content. For example, an onboarded developer made a TikTok-style channel consists of short clips of its original movie/TV shows, and if users watched the short clip in sidebar, they could click on the title and start watching full length video in main browser window.