The document discusses PharoJS, a framework that allows developers to write code in Pharo and have it transpiled to JavaScript. This allows writing both server-side code using ExpressJS and client-side code that interacts with the DOM. Key features mentioned include writing tests in Pharo and exporting JavaScript, reusing JavaScript libraries and runtime from Pharo code, and generating static HTML and JavaScript from Pharo for the client side. The talk promotes writing the full application stack - server and client sides - in Pharo and generating optimized JavaScript for both.

1. 1

2. Hijack
the JavaScript Ecosystem
Noury Bouraqadi & Dave Mason
ESUG 2023, Lyon (France)

3. I am an Addict!
3

4. Not That Kind of Addict!
4

5. I am a Smalltalk Addict!
5

6. I am a Smalltalk Addict!
6

7. I am a Smalltalk Addict!
7

8. I am Lazy!
8

9. 9
I am a Lazy Developer!
A categorized community-driven
collection of awesome Pharo
libraries, tools, frameworks and
software. Thank You
Cyril Ferlicot

10. 10
I am a Lazy Developer!

11. 11
Addict + Lazy =
+
Libraries
&
Run-Time
Development

12. ● Transpiler: Converts Pharo Code to JavaScript
● Framework: Develop JS applications in Pharo
● Libraries: Extend JS Objects with Pharo’s Behavior
● Tools: Playground + Inspector for JS Objects
● Test Framework: Test JS Code
12

13. 13
Mobile Apps with

14. 14
Mobile Apps with

15. 15
Web Apps with
PLC3000.com

16. PLC3000.com Architecture
16

17. PLC3000.com Clients
17
+

18. PLC3000.com Server
18

19. PLC3000.com Server
19
Thank you
Buenos Aires
Smalltalk Thank you
Gabriel Cotteli

20. 20
JS Server Generation?
ExpressJS

21. ● GET /data = read a string from memory
● POST /data = save a string to memory
21
Example: Minimal Web Server
ExpressJS

22. 100%
Pharo
Javascript
100%
Development Production
1. Write Tests
3. Export to JS
2. Pass the tests
22

23. 23
Testing Minimal Web Server with

24. 24
Testing Minimal Web Server with

25. 25
Testing Minimal Web Server with
Relies on
Zinc HTTP
Thank you
Sven

26. 26
Minimal Web Server with

27. 27
Minimal Web Server with

28. 28
Minimal Web Server with

29. 29
All JS Code is Managed by
JS packages code from NPM
JS from Pharo code
List of required JS packages
NPM package properties

30. 30
All JS Code is Managed by
JS packages code from NPM
JS from Pharo code
List of required JS packages
NPM package properties
Generated
from Pharo
Installed

31. 31
Server JS Code Generated with
233 KB

32. 32
Testing Static File Serving with

33. 33
Serving Static Files with

34. 34
Serving Static Files with

35. 35
Let’s Address the Client
REST
API
HTTP
Request
ExpressJS

36. 36
Web Client HTML
<img…>
<h1>...</h1>
<button…>...</button>
<span…>...</span>
<button…>...</button>
<input …>
<script …></script>
index.html

37. 37
Html Loads JS Generated by

38. 38
Html IDs for Integration with

39. 39
Web Client HTML & JS Served Statically
Client HTML file
Client JS from Pharo code

40. 40
Web Client Pharo Code with

41. 41
Talks to Server

42. 42
Links DOM Objects using HTML IDs

43. 43
Web Client Test with Instance of
PjMinimalExpressClientApp
JS Object
in the Web Browser

44. 44
Client JS Code Generated with
267 KB

45. Summary
● Reuse JS Libraries & Run-Time
● Write 100% Pharo Code
● Test + Debug in Pharo with JS Objects
● Support Different Architectures & Workflows
45
for both Server & Client Sides

46. ● Current Stable = Pharo 11
● Continuous Integration
○ SmalltalkCI
○ GitHub Actions
● Improved Performance
46
Other News of

47. 47
IWST Talk on Performance of
CSV Parser JS Lib
Charting JS Lib
2pm
Thursday
August 31st

48. Develop in Pharo, Run on JavaScript
PharoJS.org
Kindly Supported by
Thanks to all the contributors!
M
IT
License