DEV Community

ZhiHong Chua
ZhiHong Chua

Posted on

2 1

[Stack] The Heart of APP Navigation

Image description

Developing an APP with many pages can sometimes get confusing, so today I explored some fundamentals. How does app navigation work? Like a stack of pancakes. Yes, the data structure stack, which is Last In First Out (LIFO). In non-technical terms, it just means that you can only remove the latest item added to the stack, each time (so no sliding out a pancake from underneath the rest).

Image description

No really, please don't

It seems both React Native and Flutter uses the same stack navigation.

What does this mean?

It means that in APP, homepage is the bottom-most page (or ‘pancake’). Everything else is built upon it, and at each time you can only view / interact with the topmost page. To return to homepage, you can pop() pages off, or even just pop all with popToTop().

Protecting the stack

Disable gestures. Gestures are like swipe, or triple tap. Different phones / OEMs come with different variations. So disabling it ensures more stability of usage.

Sentry image

See why 4M developers consider Sentry, “not bad.”

Fixing code doesn’t have to be the worst part of your day. Learn how Sentry can help.

Learn more

Top comments (0)

Sentry mobile image

Improving mobile performance, from slow screens to app start time

Based on our experience working with thousands of mobile developer teams, we developed a mobile monitoring maturity curve.

Read more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay