Successfully created 2-way chat framework on the web with only CSS and HTML

Web-based chat tools are now relatively popular and nothing special. Most websites (especially shopping websites, service advisors) are usually built into a small chat frame, automatically pop up from a corner of the browser, help counselors, caregivers Customer care can connect and chat directly with visitors.

In fact, most web chat features of this type have in common that they are developed based on JavaScript. Along with other popular programming languages ​​such as CSS and HTML, JavaScript is one of the programmers' first choice in creating web applications and interactive websites.

1. Kotlin - the fastest growing programming language in the world

According to statistics of W3Techs, JavaScript is currently used by 95.2% of websites worldwide. While JavaScript does not always contain advantages, the simplicity makes it the first choice for web developers.

In the past, many developers tried to create two-way web chat frames without using JavaScript. They will have to use some other languages ​​like Python and also have to add some libraries to the list of requests. This generally makes creating a two-way web chat framework with non-JavaScript languages ​​much more complicated and time consuming.

1. The worst programming languages ​​you need to avoid if you don't want to "bury the youth"

However, on May 7, a software developer named Kevin Kuchta, from San Francisco, USA, did what no other web developer did before, it was created. create a two-way chat framework with full functionality only with CSS and HTML.

Of course some may mention the case of Harmless, a basic CSS chat application created last year. Unfortunately, this chat frame contains some minor inconveniences such as the infinite DOM development and there is no way to distinguish between chat frame users. So I don't think Harmless is really a complete web chat application.

Back to Kevin Kuchta's product. This developer described his results in detail on GitHub's css-only-chat page. Basically, this is a really strange "async web chat frame, in that it doesn't use any JS on the frontend", and of course can also be used to send messages back and forth between multiple user in web browser without reloading the page.

1. The development flow of programming languages, new problems that are not new

Kevin Kuchta's CSS-based chat framework works by combining background images downloaded through pseudoselectors and the constantly loading index page - making the conversation smooth and the message displayed across multiple programs. Browser.

Besides, this developer also explained in detail the inner workings of the CSS chat frame on the project page on GitHub, detailing what happens after the data is sent by one of the users and When another person on the other end receives the message.

Kevin Kuchta said the inspiration made him decide to create a JavaScript asynchronous web chat framework like this from security researcher Davy Wybirus - who recently gave details on Twitter about how websites have You can use only CSS and HTML to track mouse movement in the browser window from another web browser - a tracking method that works in Tor Browser.

In addition, some CSS-based user tracking methods can also be used to gather information such as screen resolution, browser name, link click times, as well as system information. run by checking supported fonts (fonts).

1. Microsoft officially launched Visual Studio 2019 for Windows and Mac with many new features, invited to download and experience

Putting aside the tricks of CSS, it can be said that the success of Kevin Kuchta has opened up great potential in building web applications without relying on typical high-level programming languages. is JavaScript, while efficiency and stability are still guaranteed.

Clearly, this is not considered a complete product, but with a few simple tweaks in the near future, Kevin Kuchta's chat frame could really be a viable idea to apply to reality with the role. Game is a simple web-based chat application that is equally effective.