Web Monetization Community

loading...
Cover image for Modern Jamstack PWA platform for Web Novel Contents — ProgNovel
ProgNovel

Modern Jamstack PWA platform for Web Novel Contents — ProgNovel

Radhy
Nothing to see here.
Updated on ・5 min read

Project overview

ProgNovel is (soon to be) open-source platform for web novel contents with the capability of modern web app, including Progressive Web App's offline and installable capability. It is hosted statically on Jamstack hosting and serverless backend (with Cloudflare Workers), ensuring affordable but blazing fast websites for indie web novelists and small online novel publishers alike.

The project aims to provide free and decentralized platforms for indie creators to take on venture capital-backed companies on web novel industry that currently dominated by a few big tech companies' hands, like Tencent-backed Qidian Literature, Wattpad, Amazon Kindle, Naver, Kakaopage, and so on. A few features that historically been exclusive to the native mobile apps, like offline reading, have been implemented in ProgNovel, allowing small indie players to compete even on mobile devices.

ProgNovel demo:
https://demo.prognovel.com

ProgNovel development roadmap:
https://demo.prognovel.com/roadmap/

Project team

Currently, the project only has me as the sole contributor. I'm working on it as the frontend dev, designing UX/UI myself, writing some documentation (only starting), and am actually an aspiring web novelist myself. Back when I'm dropped out from college in 2016 to commit on my writing I have no interest in getting into traditional publishing industry in my country, prefer on get my toes dirty on internet indie novelist venture, and ProgNovel project sorta happened along the way.

What we are doing

Much of the development of ProgNovel been spent on making the app fast and cheap to be operated on static and serverless hosting environments. This is due to most indie web novelist wouldn't want to be in a position of being burdened financially when hosting their own platform to showcase their novels, when platforms from big companies already promised free-to-publish (but with restrictions) medium anyone could use. With ProgNovel, anyone could publish their story without having to worry about staff approval to get paid for their story unlike Wattpad's paid story program, and anyone wouldn't need to pay anything to monetize their content as Web Monetization API, unlike most ads networks, doesn't require paid custom domains to get started (note: hosting statically on Netlify and other Jamstack host is free! And ProgNovel even more optimized to take advantage of the generous free-tier hosting provided by Jamstack hosting companies!)

As part of this effort, for example, is the rework of backend API written in Cloudflare Workers starting back in November--which is actually a response to Cloudflare's decision to make KV Workers free for free-tier users.
KV WorkerImage above: ProgNovel's build engine has been rewriting; instead of serving markdown files for content individually, it is now being published as single JSON document for each novel, only uploaded to a single key of KV Workers, ensuring lowest latency, better caching, and improve API hosting cost-effectiveness by several times due to all contents stored in a single key enabling ProgNovel to fetch several chapters in a single API request (in short, pay once for several pages).

Rewriting backend API also led me to develop CLI for ProgNovel à la Jamstack frameworks--although, in reality, instead parsing markdown to HTML, ProgNovel convert markdown files (or any other sources in the future) to a single flat JSON (to be stored in a single key of KV Workers as mentioned previously). The build engine although is very early version is already quite fast, due to the usage of WebAssembly in parsing markdowns (thanks to markdown-wasm) and incremental build already in place to ensure only modified files get parsed. More works needed to be done to improve the build engine, but overall I'm happy about the current Jamstack-y direction.
ProgNovel CLIImage above: The benefits of having to rewrite API and developing CLI not only for hosting cost-effective and better latency performance, as the new CLI also brings in build engine that reads contributors' names and map them to their Web Monetization payment pointers respectively (along with typo helpers!), making splitting revenue share easier for long novels that have many contributors (which historically have generated a lot of bad blood in the community due to disagreements on rev share).

As a demo, I picked a few non-profits Web Monetization payment pointers (source here), and now Web Monetization revenue share for the demo is live:
ProgNovel revenue share API

for more information about revenue share in ProgNovel, head to https://community.webmonetization.org/radhyr/prognovel-s-built-in-revenue-share-in-jamstack-based-markdowns-1995


There also a few features being implemented in ProgNovel already, most notably client-side bookmarking, dark mode and theme color picker, offline reading (which works just like novel platform mobile app since ProgNovel is already PWA), configurations for font size and font weight when reading novels, and asynchronous content rendering (sort of kinda browsers' content-visibility for more snappy DOM rendering when navigating through novel chapters, but custom made for ProgNovel to avoid bugs and more support for future ProgNovel's plugins).

ProgNovel has come a long way since I first began prototyping it a few years ago. It has now evolved much like modern "app-like" web app from back then. With more and more features added in, however, it still got almost the same velocity and performance as back when I started moving this project to use Svelte 3 framework.

As a reference, I diligently check the web app performance through Google's Lighthouse test, and I'm happy to say that ProgNovel managed to keep 95~100 score for performance, not to mention the speed for repeating visits and navigating through pages even more blazing fast due to ProgNovel heavily implementing PRPL pattern strategy.
ProgNovel Lighthouse Score

What community support would benefit our project?

Due to several API rewriting and the sudden development of CLI (Jamstack-y) build engine, ProgNovel is still under private repo at this point. That and the lack of hardware for development has made the progress of ProgNovel slow. So unfortunately I'm not open for community contribution at the moment.

However, if you're fine with a novel with subpar grammar and errors, please check out my novel Yashura Legacy. It's been hurriedly assembled for ProgNovel demo, and around the first 10 chapters available to read there. Please let me know if you find it interesting, comments are very much appreciated as extra motivation for me! (note: ProgNovel still hasn't integrated with comment system yet, so please let me know your thoughts on my novel here)

Link Round Up!

main project demo:
https://demo.prognovel.com/novel/yashura-legacy

the rev share open source I wrote for ProgNovel:
https://github.com/prognovel/fundme (deprecated - the project will later be moved to a new repo and name)

article I wrote about rev share on ProgNovel:
https://community.webmonetization.org/radhyr/prognovel-s-built-in-revenue-share-in-jamstack-based-markdowns-1995

Highlight other projects

There are many cool projects hosted here on Web Monetization community, but if I have to choose myself then they'll be:

Enclave Games
Defold Foundation
p5.js Editor
Exploring the future of Web Monetization
Exploring Web Monetization through Firefox

EDIT (27 Jul, 2021)
Update demo site with official domain.

Discussion (0)