Incoming links: JavaScript
webpack/template contains a reasonable starter template.
This will produce, under
dist/ the following minimized files:dist/index.html: from webpack/template/index.html. You can open it to see:show on the browser. This was added from JavaScript.Hello webpackdist/index.js: from webpack/template/index.js and anything in its import tree, e.g.:- webpack/template/main.scss: sass source. It gets embedded the the JavaScript output as a string, and the JavaScript then applies it to the page, making the font blue
lodashthird party library
You can also run this test with the development server on localhost:9000:which uses unminimized outptus, and automatically push reloads the page whenever you change any of the input files!
npm startUsed to solve partial differential equation.
TODO understand, give intuition, justification of bounds and JavaScript demo.
Intro/docs: www.jonmsterling.com/jms-005P.xml. It is very hard to find information in that system however, largely because they don't seem to have a proper recursive cross file table of contents.
This is the project with the closest philosophy to OurBigBook that Ciro Santilli has ever found. It just tends to be even more idealistic than, OurBigBook in general, which is insane!
Source code: sr.ht/~jonsterling/forester. Not on GitHub, too much idealism for that.
"Docs" at: www.jonmsterling.com/foreign-forester-jms-005P.xml Sample repo at: github.com/jonsterling/forest but all parts of interest are in submodules on the authors private Git server.
Example:
- sample source file: git.sr.ht/~jonsterling/public-trees/tree/2356f52303c588fadc2136ffaa168e9e5fbe346c/item/jms-005P.tree
- appears rendered at: www.jonmsterling.com/foreign-forester-jms-005P.xml
Author's main social media account seems to be: mathstodon.xyz/@jonmsterling e.g. mathstodon.xyz/@jonmsterling/111359099228291730 His home page:
They have
\Include like OurBigBook, nice: www.jonmsterling.com/jms-007L.xml, but OMG that name \transclude{xxx-NNNN}!! It seems to be possible to have human readable IDs too if you want: www.jonmsterling.com/foreign-forester-armaëlguéneau.xml is under trees/public/roladex/armaëlguéneau.tree.Headers have open/close:OurBigBook considered this, but went with
\subtree[jms-00YG]{}parent= instead finally to avoid huge lists of close parenthesis at the end of deep nodes.One really cool thing is that the headers render internal links as clickable, which brings it all closer to the "knowledge base as a formal ontology" approach.
Does not encourage human readable IDs, uses stuff like
jms-00YG.The markup has relatively few insane constructs, notably you need explicit open paragraphs everywhere The markup is documented at: www.jonmsterling.com/foreign-forester-jms-007N.xml
\p{}?! OMG, too idealistic, not enough pragmatism. There are however a few insane constructs:[](): markdown like links[[bluecat]]: wikilinks (but to raw IDs only, you can't seem to be able to do[[blue cat]]#{}and##{}for inline and block maths, though that might just be a sane construct with an insane name
Jon has some very good theory of personal knowledge base, rationalizing several points that Ciro Santilli had in his mind but hadn't fully put into words, which is quite cool.
OCaml dependency is not so bad, but it relies on actually LaTeX for maths, which is bad. Maybe using JavaScript for OurBigBook wasn't such a bad choice after all, KaTeX just works.
Viewing the generated output HTML directly requires
security.fileuri.strict_origin_policy which is sad, but using a local server solves it. So it appears to actually pull pieces together with JavaScript? Also output files have .xml extension, the idealism! They are reconsidering that though: www.jonmsterling.com/foreign-forester-jms-005P.xml#tree-8720.The Ctrl+K article dropdown search navigation is quite cool.
\rel and \meta allows for arbitrary ontologies between nodes as semantic triples. But they suffer from one fatal flaw: the relations are headers in themselves. We often want to explain why a relation is true, give intuition to it, and refer to it from other nodes. This is obviously how the brain works: relations are nodes just like objects.They do appear to be putting full trees on every toplevel regardless how deep and with JavaScript turned off e.g.:
which is cool but will take lots of storage. In OurBigBook Ciro Santilli only does that on OurBigBook Web where each page can be dynamically generated.
You need those because it is hard to do the following:
- client JavaScript sends a request to server
- server sends back data
- client updates what the user sees
This is hard to do notably because when the update happens, several things might need to change on the webpage at the same time.
Notably, new elements might need to be added to the webpage, which in turn means that new bindings such as button clicks have to be added to those, in a way that keeps the page working.
The only way to do this basically is to have a functional dependency graph that keeps everything in the page in working state as updates come.
Official demos: github.com/KhronosGroup/glTF-Sample-Assets These are visible at: github.khronos.org/glTF-Sample-Viewer-Release/ with a JavaScript viewer present at: github.com/KhronosGroup/glTF-Sample-Viewer TODO can you load models on the web?
Supports animations, e.g.:
gltf-viewer.donmccurdy.com/ is based on doesn't work with those examples because they have separate asset files.
f3d just worked for it.
Ciro Santilli's implementation: node Express Sequelize Next.js realworld example app.
Ahh, you can't have new ideas anymore!
Basically puts together every backend with Front-end web framework to create the exact same website.
The reference live demo can be found at: demo.realworld.io/#/ It is based on Angular.js as it links to: github.com/gothinkster/angularjs-realworld-example-app TODO backend?
There are however also live demos of other frontends, e.g.:Note that all those frontends communicate with the same backend.
- React: react-redux.realworld.io. But note that tag addition at post creation is broken there as of March 2021, but not on master: github.com/gothinkster/react-redux-realworld-example-app/issues/151#issuecomment-808417846 so they forgot to update the live server.
- Vue.js: vue-vuex-realworld.netlify.app
As of 2021 Devs are seemed a bit too focused on monetizing the project through their "how to use this project" premium tutorial, and documentation could be better: just getting the hello world of the most popular backend with the most popular frontend is not easy... come on.
github.com/gothinkster/realworld/issues/578 asks for community support, as devs have moved on since unfortunately.
Remember:
- by default, the frontends hardcode the upstream public data API:
https://conduit.productionready.io/apiso you have to hack their code to match the port of the backend. And each backend can have a different port. - when you switch between backends, you must first manually clear client-side storage cookies/local new run will fail due to authentication issues!
Important missing things from the minimum base app:
- server-side rendering:
- github.com/arrlancore/nextjs-ssr-real-world-app-example. As advertised, that global instance does render with JavaScript disabled! Proposed for upstream at: github.com/gothinkster/realworld/issues/423
- github.com/gothinkster/realworld/issues/266
- no javaScript bi-directional communication library built-in... come on: github.com/gothinkster/realworld/issues/107
- email notifications however as tested on the live demo: demo.realworld.io/#/
- error handling is broken/missing/inconsistent across apps
First you should the most popular backend/frontend combination running, which is the most likely to be working. We managed to run on Ubuntu 20.10, React + Node.js Express.js as described at github.com/gothinkster/node-express-realworld-example-app/pull/116:Then just:on both server and client, and then visit the client URL: localhost:4100/
- github.com/cirosantilli/node-express-realworld-example-app/tree/mongo4 which has a simple patch on top of github.com/gothinkster/node-express-realworld-example-app/tree/ba04b70c31af81ca7935096740a6e083563b3a4a for MongoDB 4 supportThis requires you to first install MongoDB on Ubuntu and ensure you can login to it from the command line.
- github.com/gothinkster/react-redux-realworld-example-app/tree/9186292054dc37567e707602a15a0884d6bdae35 patched to use the correct server host/port
localhost:3000:diff --git a/src/agent.js b/src/agent.js index adfbd72..e3cdc7f 100644 --- a/src/agent.js +++ b/src/agent.js @@ -3,7 +3,7 @@ import _superagent from 'superagent'; const superagent = superagentPromise(_superagent, global.Promise); -const API_ROOT = 'https://conduit.productionready.io/api'; +const API_ROOT = 'http://localhost:3030/api'; const encode = encodeURIComponent; const responseBody = res => res.body;
npm install
npm startYou have to hit the Enter key to add tags, it's terrible: github.com/gothinkster/react-redux-realworld-example-app/issues/151#issuecomment-808417846
One cool thing is that the main repo has unified backend API tests:so the per-repository tests are basically useless, and that single test can test everything for any backend! There is no frontend testing however: github.com/gothinkster/realworld/issues/269 so newb.
git clone https://github.com/gothinkster/realworld
cd realworld
git checkout e7adc6b06b459e578d7d4a6738c1c050598ba431
cd api
APIURL=http://localhost:3000/api USERNAME="u$(date +%s)" ./run-api-tests.shGod, it's impossible! You just have to convert the entire fucking call stack all the way up to async functions. It could mean refactoring hundreds of functions.
To be fair, there is a logic to this, if you put yourself within the crappiness of the JavaScript threading model. And Python is not that much better with its Global Interpreter Lock.
The problem is that async was introduced relatively late, previously we just had to use infinitely deep callback trees, which was worse:compared to the new infinitely more readable:But now we are in an endless period of transition between both worlds.
myAsync().then(ret => myAsync2(ret).then(ret2 => myAsync3(re3)))ret = await myAsync()
ret2 = await myAsync2(ret)
ret3 = await myAsync3(ret3)It is also worth mentioning that callbacks are still inescapable if you really want to fan out into a non-linear dependency graph, usually with
Promise.all:await Promise.all([
myAsync(1).then(ret => myAsync2(ret)),
myAsync(2).then(ret => myAsync2(ret)),
])Bibliography:
- stackoverflow.com/questions/21819858/how-to-wrap-async-function-calls-into-a-sync-function-in-node-js-or-javascript
- stackoverflow.com/questions/9121902/call-an-asynchronous-javascript-function-synchronously
- stackoverflow.com/questions/47227550/using-await-inside-non-async-function
- stackoverflow.com/questions/43832490/is-it-possible-to-use-await-without-async-in-js
- stackoverflow.com/questions/6921895/synchronous-delay-in-code-execution
And then, after many many hours of this work, you might notice that the new code is way, way way slower than before, because making small functions
async has a large performance impact: madelinemiller.dev/blog/javascript-promise-overhead/. Real world case with a 4x slowdown: github.com/ourbigbook/ourbigbook/tree/async-slow.Anyways, since you Googled here, you might as well learn the standard pattern to convert callbacks functions into async functions using a promise: stackoverflow.com/questions/4708787/get-password-from-input-using-node-js/71868483#71868483
async function Teletubbies meme
. Source. TODO find original source.Lists:
- www.bibsonomy.org/user/bshanks/education fantastic list, presumably by this guy:
- www.reddit.com/r/Zettelkasten/comments/168cmca/which_note_taking_app_for_a_luhmann_zettlekasten/
- www.reddit.com/r/productivity/comments/18vvavl/best_free_notetaking_app_switching_from_evernote/
- github.com/topics/note-taking has a billion projects. Oops.
- www.noteapps.ca/
Personal knowledge base recommendation threads:
TODO look into those more:
- roamresearch.com/ no public graphs
- nesslabs.com/roam-research-alternatives a bunch of open source alternatives to it
- Trillium Notes. Notable project! Pun unintended!
- Stroll giffmex.org/stroll/stroll.html. How to publish? How to see tree?
- tiddlyroam joekroese.github.io/tiddlyroam/ graph rather than text searchable ToC. Public instance? Multiuser?
- Athens github.com/athensresearch/athens rudimentary WYSIWYG
- Logseq github.com/logseq/logseq no web interface/centralized server?
- itsfoss.com/obsidian-markdown-editor. Closed source. They have an OK static website publication mechanism: publish.obsidian.md/ram-rachum-research/Public/Agents+aren't+objective+entities%2C+they're+a+model but leaf node view only for now, no cross source page render. They are committed to having plaintext source which is cool: twitter.com/kepano/status/1675626836821409792
- But no upvotes/topics. Favorites could be used as upvotes, but it does not seem like you can favorite other people's work. It's just not their focus, will never be.They have an education push: www.notion.so/product/notion-for-education but it's likely hopeless.
- CherryTree github.com/giuspen/cherrytree written in C++, GTK, WYSIWYG
- github.com/dullage/flatnotes: Python
- github.com/usememos/memos: Go
- github.com/siyuan-note/siyuan: Go
- github.com/vnotex/vnote: C++
- github.com/Laverna/laverna: JavaScript
- github.com/taniarascia/takenote
- github.com/silverbulletmd/silverbullet: TypeScript, Markdown, web-based WYSIWYG, focus on querying
Major downsides that most of those personal knowledge databases have:
- very little/no focus on public publishing, which is the primary focus of OurBigBook.com
- either limited or no multiuser features, e.g. edit protection and cross user topics
- graph based instead of tree based. For books we need a single clear ordering of a tree. Graph should come as a secondary thing through tags.
Closed source dump:
- www.toodledo.com
- Simplenote: en.wikipedia.org/wiki/Simplenote, by WordPress.com operator company Automattic
TODO it would be awesome if we could de-generalize the equations in 2D and do a JavaScript demo of it!
Not sure it is possible though because the curl appears in the equations:
WellSync, if you are gonna useSync this wonky language thing inSync one place, you might as well useSync it everywhereSync and make it more decent. See also: how to convert
async to sync in JavaScript.Their CLI debugger is a bit crap compared to GDB, basic functionality is either lacking or too verbose:Documentation at: nodejs.org/dist/latest-v16.x/docs/api/debugger.html
- stackoverflow.com/questions/65493221/how-to-break-at-a-specific-function-or-line-with-the-node-js-node-inspect-comman
- stackoverflow.com/questions/70486188/how-to-break-on-uncaught-exception-on-the-node-js-node-inspect-command-line-debu Some operations are only possible on the browser debug UI...
It is true that one image is worth a thousand words, but unfortunately it is also true that one image takes up at least as much bytes as a thousand words!
Having one single page to rule them all is of course the ideal setup for a website, as you can Ctrl + F one ToC and quickly find what you want.
And, with Linux Kernel Module Cheat Ciro noticed that it is very hard to write so much intelligent prose that becomes larger than reasonable to load on a single webpage.
He then started using this technique for everything he writes, including this page and Chinese government.
However, if there are too many images on the page, the loading of the last images would take forever in case users want to view the last sections.
There are two solutions to that:
- be traditional and create separate web pages
- be bold and load images as they appear on the viewport: stackoverflow.com/questions/2321907/how-do-you-make-images-load-only-when-they-are-in-the-viewport/57389607#57389607Edit: OK, it was standardized with
loading=lazy, without need JavaScript!Now the last awesome thing would be a method that loads first images in viewport, then those below, and then those above, that would be the ultimate solution.This question comes close: stackoverflow.com/questions/7906348/change-loading-order-of-images-already-on-page
Ciro is still deciding between those two. The traditional approach works for sure but loses the one page to rule them all benefits.
The innovative approach will work for interactive viewing, but archive.org will fail to load the images for example, and there may be other unforseen consequences.
Wikimedia Commons is awesome and automatically converts and serves smaller versions of images, so always choose the smallest images size needed by the output document. Readers can then find the higher resolution versions by following the page source.
This also comes to mind: motherfuckingwebsite.com
zettelkasten.de/posts/overview/ from zettelkasten:
How many Zettelkästen should I have? The answer is, most likely, only one for the duration of your life. But there are exceptions to this rule.
Base JavaScript library that implements the OurBigBook Markup. Use by both:
This is good software.
If it only it were written in JavaScript instead of Haskell (!?), then Ciro might have used it as the basis for OurBigBook Markup.
Likely the best JavaScript 2D game engine as of 2023.Uses Matter.js as a physics engine if enabled. There's also an alternative (in-house?) "arcade" engine: photonstorm.github.io/phaser3-docs/Phaser.Physics.Arcade.ArcadePhysics.html but it appears to be simpler/less robust (but also possibly faster).
TODO any 2D first person examples a bit like Ciro's 2D reinforcement learning games?
The examples are present under:but note that that repo is huge, about 4.5 GiB on local disk, as is has tons of assets.
git clone https://github.com/photonstorm/phaser3-examplesThe demos also include a Monaco-editor based sandbox mode where you can edit code directly on the web and see the game update which is a really sweet addition.
A language that allows you to talk to and command a computer.
There is only space for two languages at most in the world: the compiled one, and the interpreted one.
Those two are languages not by any means perfect from a language design point of view, and there are likely already better alternatives, they are only chosen due to a pragmatic tradeoff between ecosystem and familiarity.
Ciro predicts that Python will become like Fortran in the future: a legacy hated by most who have moved to JavaScript long ago (which is slightly inferior, but too similar, and with too much web dominance to be replaced), but with too much dominance in certain applications like machine learning to be worth replacing, like Fortran dominates certain HPC applications. We'll see. Maybe non performance critical scripting languages are easier to replace.
C++ however is decent, and is evolving in very good directions in the 2010's, and will remain relevant in the foreseeable future.
Bash can also be used when you're lazy. But if the project goes on, you will sooner or later regret that choice.
The language syntax in itself does not matter. All that matters is how many useful libraries and tooling it has.
This is how other languages compare:
- C: but cannot make a large codebase DRY without insanity
- Ruby: the exact same as Python, and only strong in one domain: web development, while Python rules everything else, and is not bad on web either. So just kill Ruby, please.
- JavaScript: it is totally fine if Node.js destroys Python and becomes the ONE scripting language to rule them all since Python and JavaScript are almost equally crappy (although JavaScript is a bit more of course).One thing must be said tough:
someobject.not_defined_propertysilently returningundefinedrather than blowing up is bullshit. - Go: likely a good replacement for Python. If the ecosystem gets there, will gladly use it more.
- Java: good language, but has an ugly enterprisey ecosystem, Oracle has made/kept the development process too closed, and API patenting madness on Android just kills if off completely
- Haskell: many have tried to learn some functional stuff, but too hard. Sounds really cool though.
- Rust: sounds cool, you will gladly replace C and C++ with it if the ecosystem ramps up.
- C: Microsoft is evil
- Tcl, Perl: Python killed them way back and is less insane
- R, GNU Octave and any other "numerical computing language": all of this is a waste of society's time as explained at: Section "Numerical computing language"
- Swift: Ciro would rather stay away from Apple dominated projects if possible since they sell a closed source operating system
Possible to publish pages: www.notion.so/help/public-pages-and-web-publishing
But non-paid plan currently disables "Search engine indexing" of that sharing, so it's useless. There's an "Allow duplicate as template" button though which is nice.
URLs are horrendous however, e.g.: lofty-flower-be4.notion.site/aa-2274c59a06124d5b974b781a67340670 Only the
aa in that came from us. They don't even have the guts for a fixed subdomain.Also it does not work without JavaScript, no SSR, everything is dynamic.
They don't show multiple input pages on the same render, e.g.: lofty-flower-be4.notion.site/aa-2274c59a06124d5b974b781a67340670 does not contain the child lofty-flower-be4.notion.site/bb-45df7212a2e14e04b3f9604035c7acf4 as already implemented on OurBigBook Web Dynamic Article Tree.
Cross page links to work fine. But you don't link to explicit IDs, only internal hidden IDs. This can be even slightly confusing to users as multiple identical options can show up when you start creating a link. They do try to disambiguate with the parent page however.
So this is a reasonable single-person publishing platform for your notes.
Someone made and sold a helper for it:
These are a bit like the Verilog of quantum computing.
One would hope that they are not Turing complete, this way they may serve as a way to pass on data in such a way that the receiver knows they will only be doing so much computation in advance to unpack the circuit. So it would be like JSON is for JavaScript.
Other good lists:
- quantumcomputingreport.com/resources/tools/ is hard to beat as usual.
- www.quantiki.org/wiki/list-qc-simulators
- JavaScript
- algassert.com/quirk demo: github.com/Strilanc/Quirk drag-and-drop, by a 2019-quantum-computing-Googler, impressive. You can create gates. State store in URL.
- github.com/stewdio/q.js/ demo: quantumjavascript.app/
Bibliography:
- www.epcc.ed.ac.uk/whats-happening/articles/energy-efficient-quantum-computing-simulations mentions two types of quantum computer simulation:
The most common approach to quantum simulations is to store the whole state in memory and to modify it with gates in a given order
However, there is a completely different approach that can sometimes eliminate this issue - tensor networks