Kilka innych rozszerzeń

RxJs

RxJs jest niezależną biblioteką obsługującą zdarzenia asynchroniczne poprzez obiekty obserwatorów (Observe i Observable). Można ją integrować z Reactem i Reduxem.

Dzięki RxJs uzyskujemy strumień danych, do których można użyć metod tablicowych (takich jak map i filter). Podstawową funkcją Observable jest subscribe(), wywoływana z trzema parametrami:

  • onNext() - wywoływana po wystąpieniu nowego zdarzenia.
  • onError() - wywoływana po wystąpieniu błędu.
  • onCompleted() - wywoływana po zakończeniu sekwencji zdarzeń.

Więcej informacji znajdziesz w podręczniku "Angular w przykładach", https://github.com/btroncone/learn-rxjs oraz RxR: https://dacz.github.io/rxr/index.html

React Hot Loader

Idea "Hot loadera" polega na tym, że w miejsce złożonego komponentu ładuje się jego prototyp z minimum funkcjonalności niezbędnych do wyświetlenia. Dopiero w chwili gdy komponent musi zareagować na otrzymane dane, ładuje się niezbędne do tego funkcjonalności, zastępując prototyp komponentem bardziej zbliżonym do oryginału.

Instalacja tego rozszerzenia wymaga zarówno zmian w wywołaniu ReactDOM.render() jak i procsu przygotowania aplikacji przez webpack. Więcej: https://medium.com/@baphemot/react-hot-module-reload-f6b3d34b9b86

Przykład:

import rootReducer from './reducers'
import { AppContainer } from 'react-hot-loader'
const render = () => {
  ReactDOM.render(
    <AppContainer>
      <Provider store={store}>
        <App history={history} />
      </Provider>
    </AppContainer>,
    document.getElementById('root')
  )
}

render()

// Hot reloading
if (module.hot) {
  // Reload components
  module.hot.accept('./App', () => {
    render()
  })

  // Reload reducers
  module.hot.accept('./reducers', () => {
    store.replaceReducer(connectRouter(history)(rootReducer))
  })
}

Zmienna modul.hot jest zmienną ustawiana przez webpack - gdy tryb "hot reload" jest włączony. Funkcja module.hot.accept  włącza monitor zmian - tu: w komponencie głównym aplikacji (roota). W razie potrzeby jest po prostu uruchamiany ponowny rendering. Podobnie są obsługiwane reduktory.