Web Monetization: Your New Friendly JavaScript API

Hi, everyone. I'm so thrilled to be here. This is my first talk at JS Nation and I'm so excited about it. So today, I'm going to talk about Web Monetization, a new friendly JavaScript API that I learned about a couple of years ago.

And before we dive into the topic, let me ask some questions and you can think about the answers in yourself. So how many of you have created content on the web one way or the other? It could be writing blog posts or it could be creating tutorial videos some or the other way. And how many of you are getting paid for your content? And how many of you think you should get paid for your content? And how many of you think it is easy to make payments on the internet, especially if they include scenarios like international payments between different countries?

So while thinking about the answers, you might have also thought about some of the problems that come up with the answers, right? So today, let's see if we can figure out any possible solutions to fix those problems.

Coming to me, I'm Santosh. I'm from Hyderabad, India, and I'm a principle engineer at RCCM. I'm also an Open Source Ambassador at the Interledger Foundation. Previously, I was a tech speaker at Mozilla. And as a front-end engineer, whenever I learn something new at work or if I find something interesting that I feel would be valuable for other engineers, I like to blog about it. And I also do tech talks at conferences. And I believe contributing to open source is a great way to build new skills and work with the global community. So that's how I got involved with open source projects and open source communities.

And today, this is the outline that I would like to talk about. I want to talk about the challenges and problems with monetizing the web content today, and also some of the pain points that are involved with the current monetization systems, and what could be the possible solutions around it. And if there are any possible solutions, when is it all going to be real? And we as JavaScript developers, what we could do right now about it? So this is what we are going to talk about in the next 20 minutes or so.

And before we start, let's talk about how we are currently monetizing our content on the web, and also what are the different challenges involved in the current monetizing mechanisms.

So the first thing that I want to talk about is advertisements. They have been the cornerstone of revenue generation for content platforms, but they also come up with a lot of drawbacks as well. Even the largest corporations of today depend on ads as one of their main sources of revenue. And when it comes to advertisement, privacy is a significant concern, and users often feel that their personal information is being exploited for targeting advertisement. And this can also erode the confidence of the users on any content platforms as of today. And also, ads also distract the users from the content itself. If I'm reading a blog post and if it is filled with ads, the ads usually like, they distract the user from the actual content of the blog post. And also, it is crucial to recognize that many users, ads simply don't provide a good experience. They are intrusive, they can be annoying, and sometimes they could be misleading as well.

And the other way that users can monetize their content right now is through subscriptions. Subscriptions are a great way for the user to directly support a particular content creator or a content platform. But this also comes up with many challenges. And one of the challenges is something that is called subscription fatigue. In today's world, if you look around, everything is based on a subscription model. If you want to get your goods delivered to your home, it's a subscription model. If you want to watch anything on the OTT platforms, it's a subscription model. And it becomes hard for the user to manage these subscriptions at the end of the day. At the same time, if the user is paying for a subscription, then he expects to get constant value out of it.

And you, as a content creator, should also be constantly providing value to the people who are subscribed to you. And so for example, there are platform restrictions as well. For example, imagine I liked a blog post on a particular content platform. And if I want to read only that particular article without subscribing to the whole platform, it is difficult right now. It is difficult to set up the payments and just read that only single article that I liked on a platform. So all these become roadblocks when it comes to subscription model.

And for content creators, another way to monetize their content is through sponsored content. They can create sponsored content on their platforms, and they could make money from the organization that they are posting about. But this also comes with its own significant challenges. One thing is, if you want to post sponsored content, and if you want to get those opportunities, you should already have a good user base to get these kinds of sponsorship opportunities. And also, this would also raise questions about the integrity of your content, because you start posting sponsored content on your platforms. And also, there is a conflict of interest that can erode the trust with the audience. And sometimes people perceive sponsored content as biased and inauthentic, so those are some of the platforms.

And in addition to this sponsored content, there are other ways as well, like you can, content creators often go with referral links or affiliates to generate revenue for their content. And let's talk about some of the pain points we discussed about some of the ways that users can, like the creators can monetize their content. And also we talked about the challenges with each type of solution. And let's talk about some of the pain points that are existing in our content platforms today. So this is a screenshot from Medium. I, as a person from India, I can subscribe to Medium platform for $5 or some amount and I can read the content on the Medium platform. And I, as a creator, can also write blog posts on the Medium platform. But when it comes to making money, there is a blocker. If I don't belong to one of the 40 countries listed on here, I won't be able to join the Medium partner program to make some money out of it. I can write content, I can subscribe to it, but I cannot make money out of it. This seems like an unfair situation for me, where I can spend the money, but I cannot make any money from the platform. And also there are other challenges with intermediaries and platforms as well. The payments are also not instant if you are a content creator, and if your entire reach is dependent on a single platform. And intermediaries also take a huge cut before you make any money out of it, and you will be onboarded to that monetization program when they think they can make money out of you. And also there are many limitations in the current payment solution. Like I was telling you, everything that you want to do on the Internet is easy. If you want to share content, if you want to write, or if you want to consume content, if you want to consume videos, it's all easy on the Internet.

But when it comes to making payments on the Internet, it's become hard. It has to go through regulations and other compliances to do things. And also the current payment systems lack a lot of features. Like if you want to make micro payments, for example, I want to read an article which I found interesting, I want to tip the creator, or if I want to pay 10 cents to read that particular article, it is not possible in the current payment system. You have to set up your payment instructions, and then you have to, the subscription platform should also enable the payments. And it's a huge list of things to set up before both the content creator gets any money from the consumer.

So how could we solve this? So we know the pain points, we know the challenges, and we as web developers, is there any way that we could solve this? So this was the main question that we are going to answer today. Introducing web monetization. So it's a JavaScript API, as I was telling you, IntelliJ Foundation is a non-profit organization. And we believe that we want to make payments as simple as sending an email. Just like our emails are being built on SMTP protocol, where you might be using any email client, but each email client can understand what the other email client has sent them. Similarly, imagine if payments are built on a single protocol. So that is where IntelliJ protocol comes. And IntelliJ also is working on a web monetization protocol, web monetization spec, a JavaScript API to make this seamless. And when coming to web monetization, the core concept is, if you as a web developer will add a valid address to your website using a link tag, just like you add CSS, and any person visiting your website will be able to stream some payments to that particular valid address. This is the core concept of it.

And as much time as the user spends on that particular platform, that user will be streaming so many micro-payments to that particular content platform. And if you see the whole process of it, these are the three things that we have. Web monetization provider, web monetization agent, and web monetization receiver. Receiver is the valid address owner which address that you put on a web page. So for example, you as a web developer, you have a blog. And if you put your valid address on your website, then you are the web monetization receiver. And web monetization provider is usually a browser extension, a valid where that will stream the payments from the user's valid. If I'm reading your content, web monetization provider will stream micro-payments from my valid to your valid as a web monetization receiver. And web monetization agent is a small piece of code in the browser which makes the seamless. So if you take a look at the flow diagram, the first thing is user, the site visitor, Bob, opens a website. And that site will have the valid address of the site owner, Alice. And then the second step is to web monetization well-authorized. We'll check for that valid address that is being there on the website. Make sure that it is a valid address and then it figures out how to stream the payments.

And then the web monetization provider starts making micro-payments from Bob, the site visitor's address, to Alice, the site owner. It is a valid-to-valid transfer and web monetization provider enables this particular feature. And there are some disadvantages of this web monetization as well. It only works if you're online. For example, if you have opened an article on dev.to and if you are reading it, even though you are reading it, but if your internet is offline, the owner of the creator won't be receiving any micro-payments from you. And extension will have to guess how much time you will spend in total and hence what to pay out right now. So you might not spend all the budget by the end of the month. For example, if you set a budget of $5 for every month and you configure the extension saying that, hey, I have a budget of $5 in whatever content I'm going to read over the next month, make payments to them, make micro-payments to them so that they will be benefited from this micro-payment. So if you said this, the web monetization extension has to stream, has to make guesses of how much time you are going to spend in future on a particular site and then decide how much time it should stream, how much money it has to stream at a particular interval of time. And also, one of the, it's not a disadvantage, it is about a challenge that web monetization could have. Well, Google and Apple block it because in the end they are the browser owners and Chrome or Safari block this particular JavaScript API or will it block the micro-payment citing any of the concern because the extension in the end has to be published into their store. So this is one of the challenge that we could have in the web monetization scenario.

Now we understood how the money flows from the site visitor to the site owner. Now let's talk about the web monetization has three requirements.

One is the wallet and the other one is the extension and the other one is authorization. Let's talk about the first one, the wallet. First, you as a website, create a website owner and the person who is visiting your website should have a wallet. This wallet has a unique address and that is how the payments happen from the visitor's wallet to the creator's wallet.

And the other one is an extension. An extension is a browser add-on that you add on your extension. This is where I, as a user, will authorize my wallet address with that extension. So that wallet, that web monetization provider extension, will make payments on my behalf to you as a website owner.

And the other one is authorization. It is usually used to set a rate, like how much you can afford per month. If I have a budget of five dollars, I want to spend five dollars per month to support creators that I am consuming. So this is where I give an authorization of five dollars and my extension will make payments on my behalf to the website owner.

And how is web monetization different from existing ways? We have talked about the challenges and how the content is monetized right now. Let's talk about how it is different. So the first thing, payments take time. The creators get the payment. There is a delay when they get the payment. It is not instant, but instant payments are possible in the monetization way. If I, as a website user, is reading your content, I am making micro-payments right there at that particular moment of time itself.

And in the existing ways, intermediaries are involved most of the time if you want to use ads or if you want to use subscriptions. There are usually intermediaries involved, but here it is a wallet to wallet. I, as a website user, will be paying from my wallet address to your wallet address.

And the existing ways also rely on extensive data collection. Some or more of the ways relay on data collection, but here web monetization is a privacy-conscious approach. It doesn't need any of your data for that except your wallet addresses.

And entry barriers are there in the existing ways. For example, if you want to be a writer on YouTube or if you want to be a creator on YouTube or if you want to be a writer on platforms like Medium, have a certain user base. But here in web monetization, there are no such things.

If you have 10 active visitors on your site, you will be able to make some amount of money from those 10 active visitors on your platform.

And how can web developers monetize their websites at this moment? The first thing, so this is how you monetize your content. Just like we have a CSS file, you will add a link tag with arial equal to monetization and href will point to the wallet address of who wants to get paid, the website owner.

And this is how you can listen to the monetization even. So if you want to know if someone is paying for, someone is making micro-payments on your website, this is how you do it. This is the experience you could build out of it. Imagine your existing content platform, your blog is heavily dependent on ads for making money. So what you could do is you can add this event listener and whenever you are getting any micro-payments, you can disable ads for that particular user. This is how you can provide an exclusive experience for the user.

And if you're getting any events to this monetization, then that means you are getting paid and you can disable the ads for this particular user on the platform. Otherwise, you can still sell ads and make money out of it.

And we talked about the web monetization and when it is all going to be real. So let's talk about the status of the current components, the extension, you can scan this, there is an extension, it's an open source extension. You can watch the progress of this extension, you can install it and try it out. And you can also contribute to it if you are interested in contributing to that particular web monetization extension.

And ILP enabled wallets, like I was telling you, you can go to intellectual.org slash financial services, you will find some wallet. But I think it is going to take some more time to get web monetization enabled wallets out in the world.

And let me show a small demo of how. Yeah, so this is the demo I want to show you about how web monetization works. So this is the monetization link tag on the website. And this is the extension, you go there and you configure your wallet address. So this is an authorization that you provide, FaneBus is a wallet and you are providing an authorization for a payment. And these are the existing payments already done. And you will go to your extension, add your wallet address, and then authorize the payment. You are connecting your wallet here. And you can see the monetization, which means that particular website is getting paid from the extension. So this is how the monetization works. And what you can do now as web developers until we get all the things in place.

So this is how the monetization works. And what you can do now as web developers until we get all the things in place.

So the first thing, join Interledger Slack and join the web monetization channel on Interledger Slack so that you will be updated with what is happening around the web monetization topic.

And build web monetization utilities and plugins. So whenever you see a new standard, there will be plugins that are built around the particular JavaScript API. So you can scan this code and you can go to the website. You will see all the existing libraries that are built around web monetization. You can contribute to the existing plugins as JavaScript developers, or you can build your own plugin for other frameworks as well.

Join our community calls. The web monetization community calls are open. If you have any insights that you want to provide to the web monetization team, you can do that as well. We love to hear your conversations and we want to understand the other perspective of web monetization as well.

If you want more information about how you can get involved with the web monetization spec and web monetization standard, go to webmonetization.org and you will find a get involved page there which will give you more information about getting involved with web monetization.

If you have any questions, you can join the Slack and ask us or you can ask me on Twitter and you can ask me the questions.

Thank you everyone for giving me this opportunity. I'm so excited to see you all and hope you build some great things together with web monetization. Thank you.