Pushing the limits of PHP with React PHP

Slide 1

Slide 1 text

pushing the limits with React PHP why React PHP is awesome and why YOU should care

Slide 2

Slide 2 text

Agenda - Hello! - PHP, the web of the ‘90s? - Enter React - Core concepts - Examples and demo time - Conclusions 2

Slide 3

Slide 3 text

Hello! 3

Slide 4

Slide 4 text

$ whoami - Christian Lück 4

Slide 5

Slide 5 text

$ whoami - Christian Lück → Christian Lueck 5

Slide 6

Slide 6 text

$ whoami - Christian Lück → Christian Lueck → @clue 6

Slide 7

Slide 7 text

$ whoami - Christian Lück → Christian Lueck → @clue → @another_clue 7

Slide 8

Slide 8 text

Slide 9

Slide 9 text

$ whoami - Christian Lück → Christian Lueck → @clue → @another_clue - Team Coach / Software Engineering, working professionally for 10 years - Masters degree in Information Systems Engineering - Started coding 15 years ago and could never stop :) - Passionate about pushing the limits! - Open source contributor and maintainer (React, Docker, Graphs and more) 9

Slide 10

Slide 10 text

Slide 11

Slide 11 text

Who are you? 11 now that you know me…

Slide 12

Slide 12 text

Who are you? 12 now that you know me… - PHP developers? - architecs / engineers?

Slide 13

Slide 13 text

Who are you? 13 now that you know me… - PHP developers? - architecs / engineers? - know React?

Slide 14

Slide 14 text

Who are you? 14 now that you know me… - PHP developers? - architecs / engineers? - know React? - know the other React?

Slide 15

Slide 15 text

PHP, the web of the ‘90s? 15

Slide 16

Slide 16 text

PHP and the web of the ‘90s - traditional LAMP stack - Request-Response-Cycle Apache Client PHP MySQL 16

Slide 17

Slide 17 text

PHP and the web of the ‘90s - traditional LAMP stack - Request-Response-Cycle - PHP is too slow? - We sure can improve this… 17 Apache Client PHP MySQL

Slide 18

Slide 18 text

PHP and the web of the ‘90s - traditional LAMP stack - Request-Response-Cycle - PHP is too slow? - We sure can improve this… 18 Apache Client PHP MySQL Apache Client FPM MySQL PHP PHP

Slide 19

Slide 19 text

PHP and the web of the ‘90s - traditional LAMP stack - Request-Response-Cycle - PHP is too slow? - We sure can improve this… 19 Apache Client PHP MySQL Apache Client FPM MySQL PHP PHP nginx Client FPM MySQL PHP PHP

Slide 20

Slide 20 text

PHP and the web of the ‘90s - traditional LAMP stack - Request-Response-Cycle - PHP is too slow? - We sure can improve this… 20 Apache Client PHP MySQL Apache Client FPM MySQL PHP PHP nginx Client FPM MySQL PHP PHP nginx Client FPM memcache PHP PHP MySQL

Slide 21

Slide 21 text

PHP may not be pretty… but it gets the job done! 21

Slide 22

Slide 22 text

Knock knock! Who’s there? 22

Slide 23

Slide 23 text

Knock knock! 2016! Who’s there? 23

Slide 24

Slide 24 text

Knock knock! 2016! - Separation of concerns (Frontend) - HTTP APIs (RESTful) - Integration with 3rd parties - Live-Data (ticker) - CLI tools Who’s there? 24

Slide 25

Slide 25 text

node js? 25

Slide 26

Slide 26 text

node js! 26

Slide 27

Slide 27 text

Enter React! 27

Slide 28

Slide 28 text

What is React? 28

Slide 29

Slide 29 text

What is React? non-blocking I/O 29

Slide 30

Slide 30 text

What is React? non-blocking I/O event-driven 30

Slide 31

Slide 31 text

What is React? non-blocking I/O event-driven async, not parallel 31

Slide 32

Slide 32 text

Slide 33

Slide 33 text

100% 33

Slide 34

Slide 34 text

100% pure PHP 34

Slide 35

Slide 35 text

100% pure PHP no extensions 35

Slide 36

Slide 36 text

100% pure PHP no extensions no magic 36

Slide 37

Slide 37 text

What does that even mean?! 37

Slide 38

Slide 38 text

non-blocking I/O 38

Slide 39

Slide 39 text

non-blocking I/O 39 - Calculations are fast – I/O is slow

Slide 40

Slide 40 text

non-blocking I/O 40 - Calculations are fast – I/O is slow Source: Latency Numbers Every Programmer Should Know: https://gist.github.com/jboner/2841832

Slide 41

Slide 41 text

non-blocking I/O 41 - Calculations are fast – I/O is slow - So why wait on I/O? (blocking) Source: Latency Numbers Every Programmer Should Know: https://gist.github.com/jboner/2841832

Slide 42

Slide 42 text

non-blocking I/O 42 - Calculations are fast – I/O is slow - So why wait on I/O? (blocking) - Start multiple I/O operations (non-blocking) - get notified when something happens - hello async! Source: Latency Numbers Every Programmer Should Know: https://gist.github.com/jboner/2841832

Slide 43

Slide 43 text

non-blocking I/O 43 - Calculations are fast – I/O is slow - So why wait on I/O? (blocking) - Start multiple I/O operations (non-blocking) - get notified when something happens - hello async! - single thread only so far - Multithreading + multi cores Source: Latency Numbers Every Programmer Should Know: https://gist.github.com/jboner/2841832

Slide 44

Slide 44 text

What React is not 44

Slide 45

Slide 45 text

What React is not - React is not a framework - Indepentent components (libraries) 45

Slide 46

Slide 46 text

What React is not - React is not a framework - Indepentent components (libraries) - React is not black magic / vodoo - Does not make your code faster magically 46

Slide 47

Slide 47 text

What React is not - React is not a framework - Indepentent components (libraries) - React is not black magic / vodoo - Does not make your code faster magically - React is not a replacement for your favorite framework - Symfony is here to stay 47

Slide 48

Slide 48 text

Slide 49

Slide 49 text

React core concepts 49

Slide 50

Slide 50 text

React Core concepts - Event loop (reactor) - Promises - Streams - Avoid blocking 50

Slide 51

Slide 51 text

Event loop Consumers - THE core, low-level component 51

Slide 52

Slide 52 text

Slide 53

Slide 53 text

Event loop Consumers - THE core, low-level component - Create an instance - Just use the Factory - Additional extensions for bigger payloads - something inbetween… - just pass the $loop around - Start running - keeps running forever - unless stopped or done 53 Implementors - Reactor pattern (hence the name)

Slide 54

Slide 54 text

Slide 55

Slide 55 text

Promises - Placeholder for a single future result - Possible states: - pending - fulfilled (successfully resolved) - rejected (Exception occured) 55

Slide 56

Slide 56 text

Slide 57

Slide 57 text

Promises - Placeholder for a single future result - Possible states: - pending - fulfilled (successfully resolved) - rejected (Exception occured) - no more imperative code flow $a = doA(); $b = doB(); process($a, $b); - instead (tell, don’t ask) $a->then($fulfilled = null, $rejected = null); $a->then(‘process’, ‘var_dump’); 57

Slide 58

Slide 58 text

Streams - Process large strings in chunks as they happen (think downloads) - Types - Readable (e.g. STDIN pipe) - Writable (e.g. STDOUT pipe) - Duplex (e.g. TCP/IP connection) 58

Slide 59

Slide 59 text

Streams - Process large strings in chunks as they happen (think downloads) - Types - Readable (e.g. STDIN pipe) - Writable (e.g. STDOUT pipe) - Duplex (e.g. TCP/IP connection) - interfaces, events and listeners: $dest->write(‘hello’); $source->on(‘data’, function ($data) { var_dump($data); }); $source->on(‘close’, function () { echo ‘stream closed’; }); $source->pipe($gunzip)->pipe($badwords)->pipe($dest); 59

Slide 60

Slide 60 text

Avoid blocking! - The loop must not be blocked 60

Slide 61

Slide 61 text

Avoid blocking! - The loop must not be blocked - Many functions / lib assume blocking by default - Anything >1ms should be reconsidered 61

Slide 62

Slide 62 text

Avoid blocking! - The loop must not be blocked - Many functions / lib assume blocking by default - Anything >1ms should be reconsidered - Alternatives - Single result: Promises - Evented: Streams 62

Slide 63

Slide 63 text

Avoid blocking! - The loop must not be blocked - Many functions / lib assume blocking by default - Anything >1ms should be reconsidered - Alternatives - Single result: Promises - Evented: Streams - Need a blocking function? - Fork off! - Use IPC 63

Slide 64

Slide 64 text

Slide 65

Slide 65 text

Examples and demo time! 65

Slide 66

Slide 66 text

Socket server 66 react/socket - THE canonical chat example - broadcast all incoming msgs

Slide 67

Slide 67 text

Socket server 67 react/socket - THE canonical chat example - broadcast all incoming msgs - run example server - connect via telnet: $ telnet IP 8000

Slide 68

Slide 68 text

HTTP client 68 clue/buzz-react - Simple HTTP requests - inspired by kriswallsmith/buzz - PSR-7 compatible

Slide 69

Slide 69 text

HTTP client 69 clue/buzz-react - Simple HTTP requests - inspired by kriswallsmith/buzz - PSR-7 compatible - Promises and Streams - It’s fast…

Slide 70

Slide 70 text

HTTP client 70 clue/buzz-react - Simple HTTP requests - inspired by kriswallsmith/buzz - PSR-7 compatible - Promises and Streams - It’s fast… - benchmarks in following slides about clue/docker-react

Slide 71

Slide 71 text

Packagist API clue/packagist-api-react - get information about any Composer package - simple, Promise-based - lightweight wrapper between - KnpLabs/packagist-api - clue/buzz-react 71

Slide 72

Slide 72 text

Packagist API clue/packagist-api-react - get information about any Composer package - simple, Promise-based - lightweight wrapper between - KnpLabs/packagist-api - clue/buzz-react 72 - see its examples $ php examples/search.php

Slide 73

Slide 73 text

Docker client clue/docker-react - Run apps in isolated containers - “build, ship and run, anywhere” - Controlled through HTTP API - Promises and Streams 73

Slide 74

Slide 74 text

Docker client clue/docker-react - Run apps in isolated containers - “build, ship and run, anywhere” - Controlled through HTTP API - Promises and Streams 74 - see its promise examples $ php examples/info.php - see its streaming examples $ php examples/benchmark-exec.php - throughput during talk: ~ 720 MiB/s, Docker maxed out, PHP not

Slide 75

Slide 75 text

HTTP server react/http - Pure PHP, with no additional webserver - Under active development 75

Slide 76

Slide 76 text

HTTP server react/http - Pure PHP, with no additional webserver - Under active development - Lots of third-party integrations with traditional frameworks (symfony, slim, silex, PIMF etc.) 76

Slide 77

Slide 77 text

Server sent events clue/sse-react - Server sent events (SSE) - aka. EventSource (browser API) - Streaming events to browser - limited browser support 77

Slide 78

Slide 78 text

Server sent events clue/sse-react - Server sent events (SSE) - aka. EventSource (browser API) - Streaming events to browser - limited browser support 78 - see examples connecting to initial chat $ php examples/chat-server.php - open browser: http://localhost:8001/

Slide 79

Slide 79 text

Websocket server cboden/ratchet - Async WebSocket server - bidirectional data flow between browser and server - better browser support 79

Slide 80

Slide 80 text

Redis client 80 clue/redis-react - Redis is a fast in-memory DB - very simple commands - very simple protocol - pipelined, Promise-based

Slide 81

Slide 81 text

Redis client 81 clue/redis-react - Redis is a fast in-memory DB - very simple commands - very simple protocol - pipelined, Promise-based - see its examples $ php examples/incr.php

Slide 82

Slide 82 text

Redis server 82

Slide 83

Slide 83 text

Redis server 83 - Official Redis is written in C

Slide 84

Slide 84 text

Redis server 84 clue/php-redis-server - Official Redis is written in C - Reimplementation is pure PHP

Slide 85

Slide 85 text

Redis server 85 clue/php-redis-server - Official Redis is written in C - Reimplementation is pure PHP - Very simple to add commands

Slide 86

Slide 86 text

Redis server 86 clue/php-redis-server - Official Redis is written in C - Reimplementation is pure PHP - Very simple to add commands - How fast could PHP possibly be? Let’s see…

Slide 87

Slide 87 text

Redis server 87 clue/php-redis-server - Official Redis is written in C - Reimplementation is pure PHP - Very simple to add commands - How fast could PHP possibly be? Let’s see… - see its bin $ php bin/redis-server.php - test via clue/redis-react - test via official redis CLI - run official redis benchmark during talk: - official server: ~90k OP/s - PHP server: ~50k OP/s

Slide 88

Slide 88 text

UPnP clue/ssdp-react - Univeral Plug and Play (UPnP) - Simple Service Discovery Protocol (SSDP) - dicover UPnP-enabled devices - printers - routers - multi media devices 88

Slide 89

Slide 89 text

UPnP clue/ssdp-react - Univeral Plug and Play (UPnP) - Simple Service Discovery Protocol (SSDP) - dicover UPnP-enabled devices - printers - routers - multi media devices 89 - see its examples $ php examples/search.php

Slide 90

Slide 90 text

Zenity clue/zenity-react - PHP desktop GUI applications - very simple, Promise-based 90

Slide 91

Slide 91 text

Zenity clue/zenity-react - PHP desktop GUI applications - very simple, Promise-based 91 - see its simple examples $ php examples/dialog.php - see its more realistic examples $ php examples/menu.php $ php examples/progress-*.php

Slide 92

Slide 92 text

many, MANY more third-party projects: https://github.com/reactphp/react/wiki/Users 92

Slide 93

Slide 93 text

Conclusions 93

Slide 94

Slide 94 text

Conclusions 94 - React is a real deal and here to stay - React is stable and production ready - predictable releases - but possibly feature-incomplete (check open issues)

Slide 95

Slide 95 text

Conclusions 95 - React is a real deal and here to stay - React is stable and production ready - predictable releases - but possibly feature-incomplete (check open issues) - React does not make your code faster magically

Slide 96

Slide 96 text

Conclusions 96 - React is a real deal and here to stay - React is stable and production ready - predictable releases - but possibly feature-incomplete (check open issues) - React does not make your code faster magically - Consider using React whenever you’re having to wait - Consider using React whenever you’re accessing the network

Slide 97

Slide 97 text

PHP is faster than you probably thought 97

Slide 98

Slide 98 text

Integration with traditional environments 98 integrating async into sync is easy

Slide 99

Slide 99 text

Integration with traditional environments 99 integrating async into sync is easy - just run the loop until you’re done - see clue/block-react

Slide 100

Slide 100 text

Integration with traditional environments 100 integrating async into sync is easy - just run the loop until you’re done - see clue/block-react integrating sync into async is hard

Slide 101

Slide 101 text

Integration with traditional environments 101 integrating async into sync is easy - just run the loop until you’re done - see clue/block-react integrating sync into async is hard - often requires async rewrite - consider forking instead

Slide 102

Slide 102 text

Need help? Want to help? - check each component’s README - check open issues 102

Slide 103

Slide 103 text

Need help? Want to help? - check each component’s README - check open issues - join #reactphp on irc.freenode.org - tweet @ReactPHP or #reactphp 103

Slide 104

Slide 104 text

Need help? Want to help? - check each component’s README - check open issues - join #reactphp on irc.freenode.org - tweet @ReactPHP or #reactphp - Talk to me 104

Slide 105

Slide 105 text

Need help? Want to help? - check each component’s README - check open issues - join #reactphp on irc.freenode.org - tweet @ReactPHP or #reactphp - Talk to me Did I mention I’m available? 105

Slide 106

Slide 106 text

// thank you! $loop->end(); 106 http://lueck.tv/