Community
Learn
Tools Library
AI Tools
Leisure
search
English
Article Tags
Home Technical Articles Web Front-end
Displaying Dynamic Messages Using the Web Notification API

Displaying Dynamic Messages Using the Web Notification API

Web Notifications API: Get website notifications out of browser restrictions We are used to mobile notifications from favorite websites or apps, but now it is becoming more common for browsers to push notifications directly. For example, Facebook will send notifications when you have a new friend request or someone comments on a post you participate in; Slack will send notifications in conversations you are mentioned. As a front-end developer, I'm curious how to leverage browser notifications to serve websites that don't handle a lot of information flow. How to add relevant browser notifications based on visitors’ interest in the website? This article will demonstrate how to implement a notification system on the Concise CSS website to provide a new version of the framework every time it is released.

Feb 17, 2025 pm 01:06 PM
The Myth of 'Unlimited Everything' Hosting Plans

The Myth of 'Unlimited Everything' Hosting Plans

The term "Unlimited Everything" in web hosting is often deceptive. While marketed as offering unlimited storage, bandwidth, and server resources, this is technically impossible. This is primarily a marketing tactic, but it can cause confu

Feb 17, 2025 pm 12:26 PM
Cache Fetched AJAX Requests Locally: Wrapping the Fetch API

Cache Fetched AJAX Requests Locally: Wrapping the Fetch API

This article is written by invited author Peter Bengtsson. SitePoint's special guest post is designed to bring you great content from well-known writers and speakers in the JavaScript community This article demonstrates how to implement a local cache of fetched requests so that if executed repeatedly, it will be read from the session store. The benefit of this is that you don't need to write custom code for every resource you want to cache. If you want to show off your next JavaScript party and show off your various skills in handling Promise, state-of-the-art APIs, and local storage, read on. Main gains With the Fetch API, developers can create local caches of AJAX requests by reducing redundancy

Feb 17, 2025 am 11:06 AM
Quick Tip: What Are Factory Functions in JavaScript

Quick Tip: What Are Factory Functions in JavaScript

JavaScript factory functions: Powerful pattern for building composable objects A JavaScript factory function is a function that returns an object and creates multiple similar objects without using the new or this keyword. This article will explore several uses of factory functions, including parametric factory functions, composable factory functions, asynchronous factory functions, and advanced factory functions, showing how to use them to build more flexible and easier to maintain JavaScript code. Core concept Factory function: Returns the function of the object. Parameterized factory function: The factory function that accepts parameters to change the return object structure. Composable factory functions: the work of building complex objects by combining other factory functions

Feb 17, 2025 am 10:54 AM
An Introduction into Event Loops in PHP

An Introduction into Event Loops in PHP

PHP event loop: a tool for asynchronous programming Core points A PHP event loop is a programming structure used to wait for events or messages in a scheduler, especially for handling asynchronous operations. Traditional PHP programming is synchronous, performing one operation at a time, and waiting for each operation to complete before continuing with the next operation. While the event loop allows asynchronous programming, where an operation can be started and then put on hold until the result is ready, other operations can be performed during this time. Library such as ReactPHP or Amp provides the necessary interfaces and classes to create and manage PHP event loops, allowing better use of resources and shorter response times, especially in applications that need to handle a large number of concurrent connections. Although

Feb 17, 2025 am 10:37 AM
Getting Started with PouchDB Client-Side JavaScript Database

Getting Started with PouchDB Client-Side JavaScript Database

This article has been reviewed by Sebastian Seitz and Taulant Spahiu. Thanks to SitePoint's peer reviewers for their contributions! Modern client-side web applications demand sophisticated data handling capabilities. Browsers now offer robust JavaS

Feb 17, 2025 am 10:24 AM
10 Need-to-Know RxJS Functions with Examples

10 Need-to-Know RxJS Functions with Examples

This article was reviewed by Florian Rappl and Moritz Kröger. Thanks to all the peer reviewers at SitePoint for making SitePoint’s content perfect! With the growing interest in functional reactive programming (FRP), RxJS has become one of the most popular JavaScript libraries in this paradigm. In this article, we will explore the top ten must-know functions in RxJS. Note: This article assumes that you are familiar with the basics of RxJS, as described in the article "Beginning with Functional Reactive Programming with RxJS". Key Points RxJS utilizes observable objects similar to arrays filled over time

Feb 17, 2025 am 10:08 AM
Native Infinite Scrolling with the IntersectionObserver API

Native Infinite Scrolling with the IntersectionObserver API

Intersection Observer API: Efficiently monitor DOM element visibility The Intersection Observer API is an emerging client-side JavaScript API for efficiently monitoring the visibility of specified DOM elements, which is useful for features such as lazy loading, infinite scrolling, and ad visibility. Browser support and polyfill This API is relatively new and currently has limited browser support, including Chrome Desktop 51, Chrome Android 51, Android WebView 51, Opera 38 and Opera Android 38. However, a pol in development is provided on Github

Feb 17, 2025 am 09:49 AM
Adventures in Aurelia: Creating a Custom PDF Viewer

Adventures in Aurelia: Creating a Custom PDF Viewer

This article was peer-reviewed by Vildan Softic. Thanks to all the peer reviewers at SitePoint for getting SitePoint content to its best! Working with PDF files in web applications has always been tricky. If you are lucky, your users just need to download the file. But sometimes, users need more features. I was lucky in the past, but this time, our users need the app to display PDF documents so that they can save metadata related to each page. Previously, people might have used expensive PDF plugins (such as Adobe Reader) to run in the browser to achieve this. However, after some time and experimentation, I found a better way to go on the web

Feb 17, 2025 am 09:03 AM
How to Test Your JavaScript with Selenium WebDriver and Mocha

How to Test Your JavaScript with Selenium WebDriver and Mocha

Core points Mocha.js is a feature-rich JavaScript testing framework based on Node.js, which can be used to write JavaScript functional tests in combination with Selenium WebDriver 3 and NodeJS. This requires familiarity with the basics of NodeJS and JavaScript programming languages. Mocha provides an API for building test code into test suites and test case modules to enable execution and report generation. It supports test suite setup and teardown functions, as well as test case setup and teardown functions. Selenium WebDriver is a control W

Feb 16, 2025 pm 01:21 PM
BDD in JavaScript: Getting Started with Cucumber and Gherkin

BDD in JavaScript: Getting Started with Cucumber and Gherkin

The benefits of test-driven development (TDD) are well known to improve product quality and development efficiency. Every time you write a code test, you can ensure the correctness of the code and promptly detect possible future code errors. Behavior-driven development (BDD) takes it a step further on this, testing the behavior of the product, not just code, to ensure that the product behavior is in line with expectations. This article will describe how to write BDD-style automated acceptance tests using the Cucumber framework. The advantage of Cucumber is that test cases can be written in concise natural language for easy understanding by non-technical personnel in the project. After reading this article, you can tell if Cucumber is right for your team and start writing yourself

Feb 16, 2025 pm 01:09 PM
A Beginner's Guide to HTML5 Cross-Browser Polyfills

A Beginner's Guide to HTML5 Cross-Browser Polyfills

Key Points Polyfill is a tool that allows developers to use these features in older browsers that do not support modern web features, ensuring that users of these browsers can still access and use the website without losing any features or experience. Polyfill.io is an open source project that provides the Polyfill library on demand, allowing developers to use the latest standards while maintaining compatibility with older browsers. It reads the User-Agent HTTP header and only provides the necessary Polyfill, thus reducing bloating of modern browsers. While Polyfill helps enable modern features in older browsers, it also has some potential drawbacks, such as adding

Feb 16, 2025 pm 12:38 PM
Async Operations in React Redux Applications

Async Operations in React Redux Applications

Key Points The single-threaded nature of JavaScript means that asynchronous operations, such as API calls, are critical to non-blocking UIs, and efficient handling of these operations is critical in React Redux applications. Redux Thunk, Redux-Saga, and Redux-Observables are popular Redux asynchronous operation management middleware, each providing different advantages based on the complexity and needs of the application. Redux Thunk simplifies asynchronous action distribution by allowing return functions instead of actions, enabling sequential API calls and processing related data in these functions.

Feb 16, 2025 pm 12:02 PM
Dealing with Asynchronous APIs in Server-rendered React

Dealing with Asynchronous APIs in Server-rendered React

Summary of key points Server-side rendering of React code helps reduce loading times and improve SEO flexibility, but handling asynchronous APIs can be challenging because of the need to render the application before knowing the required data. Existing solutions, such as Next.js, Redux Connect, and react-frontload, have their own advantages and disadvantages when dealing with asynchronous APIs in server- rendered React code. A custom solution can be implemented by performing two server-side renderings: the first time handles API calls and asynchronous operations, and the second time, the second time, the final page rendering is performed using the acquired data. Custom solutions require careful handling of different shapes in components

Feb 16, 2025 am 11:52 AM

Hot tools Tags

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Article

Roblox: Grow A Garden - Complete Mutation Guide
3 weeks ago By DDD
Roblox: Bubble Gum Simulator Infinity - How To Get And Use Royal Keys
3 weeks ago By 尊渡假赌尊渡假赌尊渡假赌
How to fix KB5055612 fails to install in Windows 10?
3 weeks ago By DDD
Nordhold: Fusion System, Explained
3 weeks ago By 尊渡假赌尊渡假赌尊渡假赌
Mandragora: Whispers Of The Witch Tree - How To Unlock The Grappling Hook
3 weeks ago By 尊渡假赌尊渡假赌尊渡假赌
Show More

Hot Tools

vc9-vc14 (32+64 bit) runtime library collection (link below)

vc9-vc14 (32+64 bit) runtime library collection (link below)

Download the collection of runtime libraries required for phpStudy installation

VC9 32-bit

VC9 32-bit

VC9 32-bit phpstudy integrated installation environment runtime library

PHP programmer toolbox full version

PHP programmer toolbox full version

Programmer Toolbox v1.0 PHP Integrated Environment

VC11 32-bit

VC11 32-bit

VC11 32-bit phpstudy integrated installation environment runtime library

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Show More

Hot Topics

Java Tutorial
1664
14
CakePHP Tutorial
1423
52
Laravel Tutorial
1318
25
PHP Tutorial
1269
29
C# Tutorial
1248
24
Show More