4 ms·

The animated transitions don’t work very well with iOS’s built-in “swipe from left edge” back gesture. The animation appears to double-play, since the Safari ba

by jitl 5y ago

The animated transitions don’t work very well with iOS’s built-in “swipe from left edge” back gesture. The animation appears to double-play, since the Safari back gesture implements the reveal animation in native code, then once it sends the back event to the browser, the library plays its own animation. See video here: https://jitl.notion.site/Back-gesture-iOS-3c44da9f8d13491d86052f6d64f5dab6 https://jitl.notion.site/Back-gesture-iOS-3c44da9f8d13491d86...

afavour 5y ago
This is my test for any “app-like” transition library in terms of attention to detail. It’s very difficult to get right. I wish we were able to tap into native OS transitions but alas.
- yesimahuman 5y ago
  The reality is you can't do this kind of transition when running in Safari browser because the browser gestures get in the way. It really has nothing to do with the web being able to do this or not and everything about browser chrome getting in the way. However, it's much, much better when running in a native web app container like Capacitor.
  - the_gipsy 5y ago
    There is also no alternative, thanks to apple restricting all appstore browsers to the safari webkit engine.
    - yesimahuman 5y ago
      No, the browser itself that wraps the WebKit web view is the culprit here. WebKit has nothing to do with it. Other browsers on iOS can and do implement gestures like this differently
warning26 5y ago
Yup -- it's annoying that Safari does this, but that's Apple for you. Ensuring that webapps have a worse experience than native ones is presumably considered a feature.
- deleted 5y ago
  [deleted]
- aaaaaaaaaaab 5y ago
  Safari is perfectly fine, thank you. When I swipe back, I want to go back to the previous website, where I came from. I don't care about your website's bespoke little internal navigation system.
  - jeroenhd 5y ago
    While I completely agree with you for normal websites, web apps are an entirely different beast. I think it's quite reasonable that applications have some extra logic to deal with navigation, because they're built for complex interaction, not for displaying information. I think it's quite reasonable to want to respond to a back gesture to cancel a modal that asks if you're sure about deleting <some resource>. You could render everything server side to get website-like navigation, but for these things JS is probably one of the better mechanisms to make user interaction more pleasing. This stuff should absolutely be kept away from news sites, blogs and other web resources because they're awful enough already with their constant popups about signing up for newsletters, accepting notifications and pitiful pleas to use their app. For your average PWA, though, this is definitely a bad thing.
    - dmitriid 5y ago
      > web apps are an entirely different beast. They are not. They are websites running inside a browser. So, they must respect the browser. If they pretend to be standalone and not care about the browser, it's their own fault, and not the browser's. And yes. The browser cannot distinguish between your shitty "web app" and a regular site.
    - 5y ago
hezedu 5y ago
You can set transition options to '' in iOS. https://hezedu.github.io/history-navigation-vue/api.html#transition https://hezedu.github.io/history-navigation-vue/api.html#tra...

by jitl 5y ago

afavour 5y ago

This is my test for any “app-like” transition library in terms of attention to detail. It’s very difficult to get right. I wish we were able to tap into native OS transitions but alas.

yesimahuman 5y ago
The reality is you can't do this kind of transition when running in Safari browser because the browser gestures get in the way. It really has nothing to do with the web being able to do this or not and everything about browser chrome getting in the way. However, it's much, much better when running in a native web app container like Capacitor.
- the_gipsy 5y ago
  There is also no alternative, thanks to apple restricting all appstore browsers to the safari webkit engine.
  - yesimahuman 5y ago
    No, the browser itself that wraps the WebKit web view is the culprit here. WebKit has nothing to do with it. Other browsers on iOS can and do implement gestures like this differently

warning26 5y ago

Yup -- it's annoying that Safari does this, but that's Apple for you. Ensuring that webapps have a worse experience than native ones is presumably considered a feature.

deleted 5y ago
[deleted]
aaaaaaaaaaab 5y ago
Safari is perfectly fine, thank you. When I swipe back, I want to go back to the previous website, where I came from. I don't care about your website's bespoke little internal navigation system.
- jeroenhd 5y ago
  While I completely agree with you for normal websites, web apps are an entirely different beast. I think it's quite reasonable that applications have some extra logic to deal with navigation, because they're built for complex interaction, not for displaying information. I think it's quite reasonable to want to respond to a back gesture to cancel a modal that asks if you're sure about deleting <some resource>. You could render everything server side to get website-like navigation, but for these things JS is probably one of the better mechanisms to make user interaction more pleasing. This stuff should absolutely be kept away from news sites, blogs and other web resources because they're awful enough already with their constant popups about signing up for newsletters, accepting notifications and pitiful pleas to use their app. For your average PWA, though, this is definitely a bad thing.
  - dmitriid 5y ago
    > web apps are an entirely different beast. They are not. They are websites running inside a browser. So, they must respect the browser. If they pretend to be standalone and not care about the browser, it's their own fault, and not the browser's. And yes. The browser cannot distinguish between your shitty "web app" and a regular site.
  - 5y ago

hezedu 5y ago

You can set transition options to '' in iOS. https://hezedu.github.io/history-navigation-vue/api.html#transition https://hezedu.github.io/history-navigation-vue/api.html#tra...