4 ms·
I was wondering. Isn't the page rendered on mobile and desktop based on user-agents? How would that work now?
by abhishekjha 7y ago
I was wondering. Isn't the page rendered on mobile and desktop based on user-agents? How would that work now?
- untog 7y agoNot usually, no. CSS media queries are used to format according to display size. But as a sibling here has indicated, client hints will replace the user agent here.
- deleted 7y ago[deleted]
- fny 7y agoThere not phasing out User-Agent strings entirely, they're actually upgrading them: https://github.com/WICG/ua-client-hints https://github.com/WICG/ua-client-hints It looks like there's more fine grained control in the new version.
- timw4mail 7y agoJavascript-only is not an upgrade.
- snazz 7y agoUA strings have never been an accurate indication. If you're not using JS, then you probably have no reason to be sniffing the UA string to detect browser features, since most of those features are JS-related anyway. It's an upgrade for the people who actually need to get an indication of the supported features and APIs of the user's browser. Otherwise, you should be using media queries.
- oefrha 7y agoOne exception: you might want to user sniff IE and serve a completely different version due to all the CSS problems. (I know you can use IE-only comments too, but I’ve been in the situation where making a modern version simultaneously IE9-compatible was just too frigging maddening.)
- Izkata 7y agoA bigger, site-breaking one from further up in this thread: https://news.ycombinator.com/item?id=22685632 https://news.ycombinator.com/item?id=22685632
- Avamander 7y agoDetecting dumb search crawlers, that don't support major features required for my webapp, and displaying a fallback splash has been the only reasonable way I've found.
- tenebrisalietum 7y agoI thought it used Javascript to detect screen size. At least it should react to resize events and if the dimensions are something that align with mobile, it should switch to mobile mode.
- NilsIRL 7y agoAFAIK it's also done using CSS
- wlesieutre 7y agoIn a lot of cases you shouldn't even use Javascript for this, responsive layouts can be built using CSS media queries based on viewport size. More advanced webapps might occasionally need to do something fancier than that if the mobile vs desktop functionality is (for some reason) substantially different instead of just rearranged. https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queri...
- kryptiskt 7y agoThe typical way this is done these days is by media queries in CSS, so you'd write a rule for styling based on screen width, like @media (max-width: 550 px) { body { background-color: white; } } turns the background white on small screens.
- oefrha 7y agogp is likely asking about how servers decide to redirect to the m.* version instead of the desktop version (or in some cases serve a different mobile version under the same domain), in which case, yes, it’s usually user agent sniffing.
- niea_11 7y agoIf you want to just change the styling and layout of the page depending on the user's device, then you can use css's media queries[0]. But if you want to serve two totally different pages (one for mobile and another for desktop), then I don't see how it can be done without JS or reading the user agent. [0] : https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queri...
- logfromblammo 7y agoIf you want to serve two totally different pages, you use two totally different URLs, and don't try to second-guess what the user asked for.