Browse Source

optimize webpack bundling, minimize gateway JS

master
nitowa 2 years ago
parent
commit
a4b9635ee7
6 changed files with 46 additions and 18 deletions
  1. 32
    0
      README.md
  2. 1
    0
      gateway/index.html
  3. 8
    7
      package-lock.json
  4. 2
    2
      package.json
  5. 0
    5
      src/Browser.ts
  6. 3
    4
      src/Gateway.ts

+ 32
- 0
README.md View File

@@ -0,0 +1,32 @@
1
+# Overview 
2
+
3
+httXrp is a proof of concept for a truly serverless web architecture. If serverless simply means "a server owned by someone else", httXrp pushes that definition to its limit.
4
+
5
+# How it works
6
+
7
+## 1: Getting data into and out of the blockchain
8
+
9
+Transactions on the ripple blockchain are allowed to carry up to 1kB of arbitrary data via the memo field. 
10
+We can use this to store data of any size by building a tree of references between these transactions that can then be reassembled by reading them back from the blockchain.
11
+In order to generate these transactions a library called [xrpio](https://gitea.nitowa.xyz/npm-packages/xrpio.git) is used.
12
+
13
+Highly simplified, you can visualize the process like this:
14
+
15
+![xrpio treewrite](https://i.imgur.com/G2HofSE.gif)
16
+
17
+## 2: Abstracting the webserver away from the web
18
+
19
+Using tools like `webpack`, it is possible to condense even modern complex single-page-applications into a single html file. As `xrpio` is written in JavaScript, it is even possible to embed it into such an HTML file, the use of which will become more clear a few paragraphs below.
20
+
21
+Since such a condensed HTML file is effectively nothing more than a long string it is possible to use `xrpio` to store them into the ripple blockchain and to retrieve them via a single identifying hash.
22
+
23
+![Webserverless web](https://i.imgur.com/Y0TgzVi.gif)
24
+
25
+## 3: Dynamic web applications without a backend
26
+
27
+Superficially, this technique is limited to serving static webpages, as there is no *real* backend serving these pages. However, since it is possible to embed `xrpio` into such a "static" page, it is possible to listen for transactions on the Ripple blockchain containing valid xrpio hashes and to dynamically update the webpage's content based on the stored data.  
28
+
29
+# Credits
30
+
31
+- This project was originally inspired by indImm (https://ndm-inf.github.io/ndm/main), a ripple-based file storage using IPFS.
32
+- xrpio (https://gitea.nitowa.xyz/npm-packages/xrpio.git) is heavily used in the technical architecture of this project. It is also written and maintained by me.

+ 1
- 0
gateway/index.html View File

@@ -5,6 +5,7 @@
5 5
   <script src="https://bundle.run/buffer@6.0.3"></script>
6 6
   <script src="https://cdn.jsdelivr.net/npm/ripple-lib@1.10.0/build/ripple-latest-min.min.js"></script>
7 7
   <script src="https://cdn.jsdelivr.net/npm/xrpl@2.1.1"></script>
8
+  <script src="https://cdn.jsdelivr.net/npm/xrpio@0.1.7/lib/browser/xrpio.browser.js"></script>
8 9
 </head>
9 10
 <body>
10 11
   Loading ...

+ 8
- 7
package-lock.json View File

@@ -9,9 +9,10 @@
9 9
       "version": "1.0.0",
10 10
       "license": "ISC",
11 11
       "dependencies": {
12
+        "buffer": "^6.0.3",
12 13
         "chai": "^4.3.4",
13 14
         "node-fetch": "^2.6.1",
14
-        "xrpio": "^0.1.6",
15
+        "xrpio": "^0.1.7",
15 16
         "xrpl": "^2.6.0-beta.0"
16 17
       },
17 18
       "devDependencies": {
@@ -3684,9 +3685,9 @@
3684 3685
       }
3685 3686
     },
3686 3687
     "node_modules/xrpio": {
3687
-      "version": "0.1.6",
3688
-      "resolved": "https://registry.npmjs.org/xrpio/-/xrpio-0.1.6.tgz",
3689
-      "integrity": "sha512-SHm3NfrRv9i82OWrUdyB+Djn0Zr6qwwMfs/wemNR1pf2ajorfiOPpWnvKQTgAZcfgS2DliIfMuF8nRiqfXlmmg==",
3688
+      "version": "0.1.7",
3689
+      "resolved": "https://registry.npmjs.org/xrpio/-/xrpio-0.1.7.tgz",
3690
+      "integrity": "sha512-X/Hxlf31KC1OONq7NYQ518Esd8LHYpyc/RFN9F1J9Nr8WEjgz/XaJDR4IakV7MrNeC3uIRz6/qGFPFWHw2Rr+g==",
3690 3691
       "dependencies": {
3691 3692
         "ripple-lib": "^1.10.0",
3692 3693
         "xrpl": "^2.1.1"
@@ -6717,9 +6718,9 @@
6717 6718
       "requires": {}
6718 6719
     },
6719 6720
     "xrpio": {
6720
-      "version": "0.1.6",
6721
-      "resolved": "https://registry.npmjs.org/xrpio/-/xrpio-0.1.6.tgz",
6722
-      "integrity": "sha512-SHm3NfrRv9i82OWrUdyB+Djn0Zr6qwwMfs/wemNR1pf2ajorfiOPpWnvKQTgAZcfgS2DliIfMuF8nRiqfXlmmg==",
6721
+      "version": "0.1.7",
6722
+      "resolved": "https://registry.npmjs.org/xrpio/-/xrpio-0.1.7.tgz",
6723
+      "integrity": "sha512-X/Hxlf31KC1OONq7NYQ518Esd8LHYpyc/RFN9F1J9Nr8WEjgz/XaJDR4IakV7MrNeC3uIRz6/qGFPFWHw2Rr+g==",
6723 6724
       "requires": {
6724 6725
         "ripple-lib": "^1.10.0",
6725 6726
         "xrpl": "^2.1.1"

+ 2
- 2
package.json View File

@@ -17,10 +17,10 @@
17 17
   "author": "",
18 18
   "license": "ISC",
19 19
   "dependencies": {
20
+    "buffer": "^6.0.3",
20 21
     "chai": "^4.3.4",
21 22
     "node-fetch": "^2.6.1",
22
-    "xrpio": "^0.1.6",
23
-    "buffer": "^6.0.3",
23
+    "xrpio": "^0.1.7",
24 24
     "xrpl": "^2.6.0-beta.0"
25 25
   },
26 26
   "devDependencies": {

+ 0
- 5
src/Browser.ts View File

@@ -1,5 +0,0 @@
1
-(window as any).global = window;
2
-(window as any).Buffer = (window as any).buffer.Buffer;
3
-const rippleApi = require('xrpio')
4
-window['xrpIO'] = rippleApi.xrpIO
5
-

+ 3
- 4
src/Gateway.ts View File

@@ -1,8 +1,7 @@
1
-(window as any).global = window;
2
-(window as any).Buffer = (window as any).Buffer || require('buffer/').Buffer;
3 1
 (window as any).buffer = (window as any).Buffer
4
-import { xrpIO } from 'xrpio';
5
-(window as any).xrpIO = xrpIO;
2
+//import { xrpIO } from 'xrpio';
3
+
4
+declare const xrpIO
6 5
 declare const DATA_HASH: string
7 6
 
8 7
 const api = new xrpIO("wss://s.altnet.rippletest.net:51233")

Loading…
Cancel
Save