react-router vs react-router-dom | "React Yönlendirme Kütüphaneleri" npm Paketleri Karşılaştırması

Paket	İndirmeler	Stars	Boyut	Issues	Yayın Tarihi	Lisans

react-router	16,091,213	54,770	2.3 MB	219	il y a 2 jours	MIT
react-router-dom	14,608,631	54,770	5.46 kB	219	il y a 2 jours	MIT

Paket

İndirmeler

Stars

Boyut

Issues

Yayın Tarihi

Lisans

react-router

16,091,213

54,770

2.3 MB

219

il y a 2 jours

MIT

react-router-dom

14,608,631

54,770

5.46 kB

219

il y a 2 jours

MIT

Platform Desteği

react-router:
react-router, hem web hem de mobil uygulamalar için platform bağımsız bir yönlendirme çözümüdür. Bu, geliştiricilerin aynı yönlendirme mantığını farklı platformlarda kullanmalarına olanak tanır.
react-router-dom:
react-router-dom, özellikle tarayıcı tabanlı uygulamalar için tasarlanmıştır. Bu, web uygulamaları için optimize edilmiş yönlendirme bileşenleri ve işlevsellik sunduğu anlamına gelir.

Ekstra Özellikler

react-router:
react-router, yönlendirme mantığını yönetmek için gerekli olan temel bileşenleri sağlar. Ancak, tarayıcıya özgü özellikler veya DOM ile etkileşim için ek işlevsellik sunmaz.
react-router-dom:
react-router-dom, tarayıcı geçmişi, URL güncellemeleri ve DOM ile etkileşim gibi ek özellikler sunar. Bu, web uygulamalarında daha zengin ve etkileşimli yönlendirme deneyimleri oluşturmayı sağlar.

Kullanım Kolaylığı

react-router:
react-router, basit ve anlaşılır bir API sunar. Ancak, tarayıcı özelliklerini kullanmak isteyenler için bazı eksiklikler olabilir.
react-router-dom:
react-router-dom, tarayıcı tabanlı uygulamalar için özel olarak tasarlandığı için, bu tür uygulamalarda daha fazla kullanım kolaylığı ve işlevsellik sunar.

Örnek Kullanım

react-router:

react-router ile basit bir yönlendirme örneği:

import { BrowserRouter as Router, Route, Switch } from 'react-router';

function App() {
  return (
    <Router>
      <Switch>
        <Route path="/" exact component={Home} />
        <Route path="/about" component={About} />
      </Switch>
    </Router>
  );
}

react-router-dom:

react-router-dom ile basit bir yönlendirme örneği:

import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';

function App() {
  return (
    <Router>
      <Switch>
        <Route path="/" exact component={Home} />
        <Route path="/about" component={About} />
      </Switch>
    </Router>
  );
}