Reactive Streams in the Web. Florian Stefan ebay Classifieds Group GOTO Berlin 2017

Size: px

Start display at page:

Download "Reactive Streams in the Web. Florian Stefan ebay Classifieds Group GOTO Berlin 2017"

Stephanie Harper
6 years ago
Views:

2 Reactive Streams in the Web Florian Stefan ebay Classifieds Group GOTO Berlin 2017

3 Who am I? Florian Stefan mobile.de (ebay Classifieds Group)

4 Why are we here? Concurrent Remote BFF Calls HTTP Service A Topic Event-Driven Service B Topic Systems Database

5 HTML Rendering Widget Widget Server-Side Rendering Widget Concurrent Remote BFF Calls Widget Widget AJAX

6 HTML Rendering Server-Side Rendering Time To First Byte Prerendering / Caching

7 HTML Rendering AJAX Head-of-line blocking Multiplexing with HTTP/2

8 The Reactive Landscape Concurrent Remote Calls Backpressure Marble Diagrams RxJava Distributed Systems Reactive Streams Reactive Extensions Event-Driven Systems Akka Streams Higher-Order Functions Reactor Declarative Programming

9 The Reactive Landscape Concurrent Remote Calls Backpressure Marble Diagrams RxJava Distributed Systems Reactive Streams Reactive Extensions Event-Driven Systems Akka Streams Higher-Order Functions Reactor Declarative Programming

10 Reactive Extensions Network Boundary Service API some thing public Something loadbyid(int id) { return Service API Resource somethings.loadbyid(id); public } interface Somethings { Something loadbyid(int id); }

11 Reactive Extensions Network Boundary Service API public CompletableFuture<Something> Service loadbyid(int API id) { Resource return supplyasync(() -> somethings.loadbyid(id), executor); } some thing

12 Reactive Extensions Network Boundary Service API some thing public CompletableFuture<Something> loadbyid(int id) { Service API Resource CompletableFuture<Something> eventualsomething = new CompletableFuture<>(); public interface Somethings { somethings.loadbyid(id, (error, something) -> { void if loadbyid(int (error!= null) id, { BiConsumer<Exception, Something> callback); eventualsomething.completeexceptionally(error); } } else { eventualsomething.complete(something); } }); } return eventualsomething;

13 Reactive Extensions CompletableFuture<T> represents an already scheduled task completes only once Mono<T> represents a building plan (caller has to subscribe) emits at most one value Flux<T> represents a building plan (caller has to subscribe) emits many values subscribe {, }

14 Reactive Extensions [,, ] Publisher fromarray { } wraps Operator map { } subscribes to Subscribe r subscribe { }

15 Reactive Extensions Circle[] circles = { Circle.of(BLUE),... }; Flux.fromArray(circles).map(circle -> Square.of(circle.getColor())).log().subscribe(...); [main] INFO - onsubscribe() [main] INFO -? [main] INFO - onnext(square(blue)) [main] INFO - onnext(square(yellow)) [main] INFO - onnext(square(green)) [main] INFO - oncomplete()

16 The Reactive Landscape Concurrent Remote Calls Backpressure Marble Diagrams RxJava Distributed Systems Reactive Streams Reactive Extensions Event-Driven Systems Akka Streams Higher-Order Functions Reactor Declarative Programming

17 Backpressure onnext( ) Publisher subscribe Subscriber

completed tasks = 0 ] onnext( 5 ) Publisher Subscriber ExecutorService executorservice = new ThreadPoolExecutor( nthreads,

18 Backpressure java.util.concurrent.rejectedexecutionexception: Task rejected from ThreadPoolExecutor [ Running, pool size = 2, active threads = 2, queued tasks = 4, completed tasks = 0 ] onnext( 5 ) Publisher Subscriber ExecutorService executorservice = new ThreadPoolExecutor( nthreads, nthreads, 0L, TimeUnit.MILLISECONDS, new LinkedBlockingQueue<>(capacity) ); ids.stream().map(id -> executorservice.submit(() -> somethings.loadbyid(id))).collect(tolist()).stream().map(waitforsomething()).foreach(handlesomething());

19 Backpressure onnext( ) Publisher request(2) request(3) subscribe Subscriber

20 Backpressure onnext( 5 ) Publisher Subscriber ExecutorService executorservice = new ThreadPoolExecutor( nthreads, nthreads, 0L, TimeUnit.MILLISECONDS, new LinkedBlockingQueue<>(capacity) ); Scheduler scheduler = Schedulers.fromExecutorService(executorService); Flux.fromIterable(ids).log().flatMap(id -> Mono.just(id).map(somethings::loadById).subscribeOn(scheduler), 3).doOnNext(handleSomething()).subscribe();

21 Backpressure Calling Thread Scheduler flatmap { } subscribeon { }.flatmap(id -> Mono.just(id).map(somethings::loadById).subscribeOn(scheduler), 3) subscribe { }

22 Backpressure onnext( 5 ) Publisher Subscriber [main] INFO - onsubscribe() [main] INFO -? request(3) [main] INFO - onnext(1) [main] INFO - onnext(2) [main] INFO - onnext(3) [pool-1] INFO - request(1) [pool-1] INFO - onnext(4) [pool-2] INFO - request(1) [pool-2] INFO - onnext(5) [pool-2] INFO - oncomplete() ExecutorService executorservice = new ThreadPoolExecutor( nthreads, nthreads, 0L, TimeUnit.MILLISECONDS, new LinkedBlockingQueue<>(capacity) ); Scheduler scheduler = Schedulers.fromExecutorService(executorService); Flux.fromIterable(ids).log().flatMap(id -> Mono.just(id).map(somethings::loadById).subscribeOn(scheduler), 3).doOnNext(handleSomething()).subscribe();

23 The Reactive Landscape Concurrent Remote Calls Backpressure Marble Diagrams RxJava Distributed Systems Reactive Streams Reactive Extensions Event-Driven Systems Akka Streams Higher-Order Functions Reactor Declarative Programming

24 Progressive HTML Rendering Widget Widget Transfer-Encoding: chunked Widget Concurrent Remote BFF Calls Widget Widget

25 Progressive HTML Rendering <dependency> <groupid>org.springframework.boot</groupid> <artifactid>spring-boot-starter-web</artifactid> </dependency> <dependency> <groupid>org.springframework.boot</groupid> <artifactid>spring-boot-starter-webflux</ artifactid> </dependency>

26 Progressive Hello public class Application { Hello Hello public static void main(string[] args) { Hello SpringApplication.run(Application.class, args); = "hello") public Flux<String> sayhello() { return Flux.interval(Duration.ofMillis(500)).map(tick -> "Hello\n"); } } curl -i -N localhost:8080/hello HTTP/ Content-Type: text/plain Transfer-Encoding: chunked

27 Progressive HTML Rendering Publisher Spring 5 WebClient Processor Reactive-Friendly Thymeleaf View Subscribe r Reactive Web Server

28 Progressive HTML Rendering Publisher Spring 5 WebClient URI uri =... String name =... Mono<Pagelet> pageletmono = webclient.get().uri(uri).exchange().flatmap(res -> res.bodytomono(string.class)).map(body -> new Pagelet(name, body)); List<Mono<Pagelet>> pageletmonos =...;... = Flux.merge(pageletMonos);

29 Progressive HTML Rendering Processor Reactive-Friendly Thymeleaf = "/widgets") public String widgets(model model) { List<String> pageletnames = widgetservice.getpageletnames(); Flux<Pagelet> pagelets = widgetservice.loadpagelets(); model.addattribute("pageletnames", pageletnames); model.addattribute("pagelets", ReactiveDataDriverContextVariable new ReactiveDataDriverContextVariable(pagelets, 1)); return "widgets"; }

30 Progressive HTML Rendering Processor Reactive-Friendly Thymeleaf View <article th:each="pagelet: ${pagelets}" class="..."> <section class="..."> <div class="..."> <div th:utext="${pagelet.content}" class="..."></div> </div> </section> </article> List<Mono<Pagelet>> pageletmonos =...;... = Flux.merge(pageletMonos);

31 Progressive HTML Rendering Processor Reactive-Friendly Thymeleaf View <script <article th-inline="javascript" th:each="pageletname: th:each="pagelet ${pageletnames}" : ${pagelets}"> class="..."> (function() { <section var element class="..."> = document.getelementbyid("[[$ {pagelet.name}]]"); <div th:id="${pageletname}" class="..."> if(element) <div class="...">...</div> { </div> element.innerhtml = "[(${pagelet.content})]"; </section> } </article> })(); </script>

32 Progressive HTML Rendering

33 What s more? Reactive Systems Cold Streams vs. Hot Streams Reactive Database Drivers Backpressure Strategies Threaded vs. Evented Server Model WebSockets and Server-Sent Events

34 Thank you!

35 Questions?

Spring MVC 4.x Spring 5 Web Reactive

Part 1 Spring MVC 4.x Spring 5 Web Reactive Rossen Stoyanchev @rstoya05 Spring MVC 4.3 Reactive programming for Java devs Spring 5 Web Reactive Shortcut Annotations @RequestMapping @GetMapping @PostMapping