Router — iOS और Android में रूटिंग पैटर्न के मूल सिद्धांत

Router क्या है: रूटिंग पैटर्न का सार

Router — एक पैटर्न जो स्क्रीन के बीच संक्रमण के तर्क को एनकैप्सुलेट करता है। मुख्य विचार: ViewController (या Presenter/ViewModel) सीधे navigationController.pushViewController को कॉल नहीं करता, बल्कि Router को नेविगेट करने के इरादे के बारे में सूचित करता है। Router तय करता है कि कौन सा ViewController बनाना है और इसे कैसे प्रदर्शित करना है। Router सरल (नेविगेशन विधियों का सेट) या जटिल (URL स्कीम रूटिंग, deep links और push सूचनाओं के साथ) हो सकता है।

Router के तीन दृष्टिकोण — सेवा के रूप में Router (ग्लोबल Navigator सिंगलटन), मॉड्यूल घटक के रूप में Router (VIPER दृष्टिकोण), प्रोटोकॉल के रूप में Router (Coordinator के लिए एब्स्ट्रैक्शन)। ग्लोबल Router — सरलता (प्रति एप्लिकेशन एक इंस्टेंस) — छोटे प्रोजेक्ट्स में लोकप्रिय। मॉड्यूलर Router — प्रत्येक फीचर का अपना Router — VIPER और Clean Architecture मानक। प्रोटोकॉल Router — Coordinator में उपयोग: push/present/pop/dismiss विधियों के साथ RouterProtocol।

पैटर्न का इतिहास — Router वेब फ्रेमवर्क (URL Router — Rails Routes, Express.js) में दिखाई दिया और मोबाइल डेवलपमेंट के लिए अनुकूलित किया गया। iOS में, VIPER (2015-2017) के उदय के साथ Router लोकप्रिय हुआ। Android में, Router Jetpack Navigation (2018) का हिस्सा है, जो Google का मानक नेविगेशन समाधान है। आज, Router किसी भी मॉड्यूलर मोबाइल एप्लिकेशन आर्किटेक्चर का अभिन्न अंग है।

iOS में Router: Swift में कार्यान्वयन

iOS Router — विभिन्न नेविगेशन प्रकारों के लिए विधियों वाला एक प्रोटोकॉल। मूल कार्यान्वयन UINavigationController को रैप करता है। Router मॉडल प्रेजेंटेशन (present/dismiss), नेविगेशन स्टैक में push/pop, Split View Controller के लिए showDetail और फुल-स्क्रीन प्रेजेंटेशन (iOS 13+) को संभाल सकता है। Router ViewControllers नहीं बनाता — यह एक तैयार इंस्टेंस प्राप्त करता है और इसे प्रदर्शित करता है। ViewController निर्माण एक फैक्ट्री (Assembly, DI कंटेनर) या Coordinator द्वारा किया जाता है।

// iOS के लिए RouterProtocol
protocol RouterProtocol {
    func push(_ viewController: UIViewController, animated: Bool)
    func pop(animated: Bool)
    func popToRoot(animated: Bool)
    func present(_ viewController: UIViewController, animated: Bool)
    func dismiss(animated: Bool)
    func setViewControllers(_: [UIViewController], animated: Bool)
}

// UINavigationController के माध्यम से Router कार्यान्वयन
class NavigationRouter: RouterProtocol {
    private let navigationController: UINavigationController

    init(navigationController: UINavigationController) {
        self.navigationController = navigationController
    }

    func push(_ vc: UIViewController, animated: Bool) {
        if navigationController.presentedViewController {
            navigationController.dismiss(animated: false)
        }
        navigationController.pushViewController(vc, animated: animated)
    }

    func pop(animated: Bool) {
        navigationController.popViewController(animated: animated)
    }

    func popToRoot(animated: Bool) {
        navigationController.popToRootViewController(animated: animated)
    }

    func present(_ vc: UIViewController, animated: Bool) {
        navigationController.present(vc, animated: animated)
    }

    func dismiss(animated: Bool) {
        navigationController.dismiss(animated: animated)
    }

    func setViewControllers(_ vcs: [UIViewController], animated: Bool) {
        navigationController.setViewControllers(vcs, animated: animated)
    }
}

// Assembly — Router के साथ मॉड्यूल बनाना
protocol ProfileModuleFactory {
    func makeProfileView() -> UIViewController
}

VIPER में Router — प्रत्येक VIPER मॉड्यूल का अपना Router होता है, जो जानता है कि वर्तमान मॉड्यूल से कौन सी स्क्रीन खोलनी हैं। Router अगले मॉड्यूल का ViewController एक फैक्ट्री के माध्यम से बनाता है और नियंत्रण सौंपता है। VIPER में Router एकमात्र घटक है जिसमें import UIKit होता है (View को छोड़कर)। यह Presenter और Interactor के परीक्षण को सरल बनाता है: वे UIKit पर निर्भर नहीं होते।

Android में Router: Jetpack Navigation Component

Jetpack Navigation Component — Android के लिए मानक राउटर, 2018 से Google द्वारा अनुशंसित। नेविगेशन XML ग्राफ (nav_graph.xml) में परिभाषित किया गया है: नोड (fragments, activities, destinations) और किनारे (actions)। NavController संक्रमण प्रबंधित करता है: FragmentManager.replace/add को कॉल करता है और बैक स्टैक प्रबंधित करता है। Navigation Component deep links, आर्गुमेंट, संक्रमण एनिमेशन और type-safe डेटा पासिंग के लिए Safe Args का समर्थन करता है।

// nav_graph.xml — नेविगेशन ग्राफ
<!-- @xml/nav_graph.xml -->
<navigation xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/nav_graph"
    app:startDestination="@id/loginFragment">

    <fragment android:id="@+id/loginFragment"
        android:name=".ui.login.LoginFragment">
        <action android:id="@+id/to_home"
            app:destination="@id/homeFragment" />
    </fragment>

    <fragment android:id="@+id/homeFragment"
        android:name=".ui.home.HomeFragment">
        <argument android:name="userId"
            android:defaultValue="0"
            app:argType="integer" />
        <deepLink app:uri="myapp://home/{userId}" />
    </fragment>
</navigation>

// Kotlin — NavController के माध्यम से नेविगेशन
class LoginFragment : Fragment() {
    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)
        binding.loginButton.setOnClickListener {
            val action = LoginFragmentDirections.toHome(userId = 42)
            findNavController().navigate(action)
        }
    }
}

// Safe Args — type-safe आर्गुमेंट
class HomeFragmentArgs : NavArgs {
    val userId: Int get() = arguments?.getInt("userId") ?: 0
}

// NavigationUI — Toolbar, BottomNav, Drawer के साथ एकीकरण
class MainActivity : AppCompatActivity() {
    private lateinit var navController: NavController

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        val navHost = supportFragmentManager
            .findFragmentById(R.id.nav_host_fragment) as NavHostFragment
        navController = navHost.navController
        NavigationUI.setupActionBarWithNavController(this, navController)
    }
}

Android Navigation में Deep links — Navigation Component स्पष्ट deep links (PendingIntent + NavDeepLinkBuilder) और अंतर्निहित (मेनिफेस्ट में intent-filter के माध्यम से) का समर्थन करता है। एक deep link किसी भी nav_graph नोड पर ले जा सकता है। push सूचना प्रबंधन: Notification NavDeepLinkBuilder के साथ PendingIntent बनाता है, जो बैक स्टैक को पुनर्स्थापित करता है और वांछित स्क्रीन खोलता है। Navigation Component स्वचालित रूप से Up/Back बटन संभालता है और उपयोगकर्ता को पिछली स्क्रीन पर लौटाता है।

URL Routing: Deeplink और Universal Link रूटिंग

URL Routing — URL स्कीम, deep links और universal links पर आधारित रूटिंग। एप्लिकेशन एक स्कीम (myapp://profile/42) या universal link (https://example.com/profile/42) पंजीकृत करता है। Router URL को पार्स करता है, पैरामीटर (userId=42) निकालता है और संबंधित स्क्रीन खोलता है। URL Routing एप्लिकेशन को बाहर से खोलने की अनुमति देता है: वेबसाइट लिंक, ईमेल, push सूचना, QR कोड के माध्यम से। iOS NSUserActivity + universal link का उपयोग करता है, Android — intent-filter + deep link का।

// URL Router — deep link पार्सिंग और नेविगेशन
protocol URLRoute {
    var pattern: String { get }
    func navigate(parameters: [String: String], router: RouterProtocol)
}

struct ProfileRoute: URLRoute {
    let pattern = "myapp://profile/{userId}"

    func navigate(parameters: [String: String], router: RouterProtocol) {
        guard let userId = parameters["userId"] else { return }
        let profileVC = ProfileViewController(userId: userId)
        router.push(profileVC, animated: true)
    }
}

// URL Router — URLs को रूट्स से मैप करना
class URLRouter {
    private var routes: [URLRoute] = []

    func handle(_ url: URL, router: RouterProtocol) {
        for route in routes {
            if let params = matchPattern(route.pattern, url: url) {
                route.navigate(parameters: params, router: router)
                return
            }
        }
    }
}

व्यवहार में Deep link रूटिंग — एप्लिकेशन को तीन अवस्थाओं में deep links संभालना चाहिए: चल नहीं रहा (deep link के साथ लॉन्च), बैकग्राउंड में (बैकग्राउंड से पुनर्स्थापना), सक्रिय (onNewIntent/SceneDelegate)। URL Router को बैक स्टैक को सही ढंग से पुनर्स्थापित करना चाहिए: प्रोफ़ाइल स्क्रीन पर deep link करते समय, उपयोगकर्ता को Back दबाकर पिछली स्क्रीन पर लौटने में सक्षम होना चाहिए। iOS और Android बैक स्टैक को अलग-अलग तरीके से संभालते हैं — Router को प्लेटफ़ॉर्म-विशिष्ट सुविधाओं को ध्यान में रखना चाहिए।

Router की Coordinator और Navigator से तुलना

Router vs Coordinator — Router प्रश्न का उत्तर देता है "स्क्रीन कैसे दिखाएं?" (push/present), Coordinator — "कौन सी स्क्रीन दिखाएं?" (कौन सा फ्लो शुरू करें)। Router नेविगेशन टूल है, Coordinator फ्लो आयोजक है। Coordinator Router का उपयोग करता है। VIPER में, Router दोनों कार्य करता है: तय करता है कि कहाँ जाना है और कैसे दिखाना है। MVVM-C में, Router Coordinator द्वारा उपयोग किया जाने वाला एक अलग प्रोटोकॉल है। पैटर्न एक दूसरे को बाहर नहीं करते बल्कि पूरक करते हैं।

Router vs Navigator — Navigator iOS समुदाय में Router का पुराना नाम है। प्रारंभिक कार्यान्वयन में, Navigator नेविगेशन विधियों वाला एक Singleton वर्ग था। Navigator एक ग्लोबल Router सिंगलटन है। Navigator सरल है लेकिन छिपी निर्भरताएँ बनाता है। प्रोटोकॉल-आधारित Router अधिक परीक्षण योग्य और मॉड्यूलर है। Navigator सख्त आर्किटेक्चर के बिना प्रोजेक्ट्स के लिए उपयुक्त है, Router — Clean Architecture और VIPER के लिए।