gitwtfhub

wtf is ngx-loading-bar?

pleerock/ngx-loading-bar — explained in plain English

Analysis updated 2026-08-15 · repo last pushed 2017-04-03

13TypeScriptAudience · developerComplexity · 2/5DormantSetup · easy

TL;DR

An Angular component that shows a slim animated progress bar at the top of a webpage while content is loading, giving users visual feedback during slow page loads.

Mindmap

mindmap
  root((repo))
    What it does
      Top loading bar
      Animated progress
      Visual feedback
    Customization
      Bar color
      Bar height
      Animation speed
    Tech stack
      Angular
      TypeScript
    Use cases
      Slow data loads
      Image heavy pages
      Polished UX feel
    Audience
      Angular developers
      Frontend builders

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

Why would anyone build with this?

REASON 1

Show a loading bar while your Angular app fetches large amounts of data.

REASON 2

Give users visual feedback during image-heavy page loads so the page doesn't feel frozen.

REASON 3

Add a polished, responsive feel to slow-loading Angular pages with minimal effort.

What's in the stack?

AngularTypeScript

How it stacks up

pleerock/ngx-loading-barabhi-arya1/riffandersondanieln/hexllama
Stars131313
LanguageTypeScriptTypeScriptTypeScript
Last pushed2017-04-03
MaintenanceDormant
Setup difficultyeasyhardeasy
Complexity2/54/52/5
Audiencedeveloperdevelopervibe coder

Figures from each repo's GitHub metadata at analysis time.

How do you spin it up?

Difficulty · easy Time to first run · 5min

Unmaintained project, you will need to fork and update it for newer Angular versions yourself.

No license information is provided in the repository.

Wtf does this do

ng2-loading-bar is a visual component for Angular web apps that shows a thin progress bar at the top of the page while content is loading. If you've ever watched a slim colored stripe crawl across the top of a webpage while waiting for it to open, this project helps you build exactly that experience. After installing the package, a developer drops the loading bar component near the top of their page layout. They can customize basic properties like the bar's color, height, and how fast the animation moves. Behind the scenes, the component pairs with a service that lets the app programmatically control the bar, starting, stopping, resetting, or marking it complete whenever the underlying data is ready. This means the bar doesn't just animate on its own, the application tells it when to start and finish based on real events like a data fetch finishing. Someone building an Angular application who wants to give users visual feedback during slow page loads would use this. For example, if your app pulls in a lot of data or images and the screen feels frozen for a few seconds, adding this bar reassures users that something is happening and the page hasn't crashed. It's a small touch that makes an app feel more responsive and polished without requiring much effort. One notable thing: the project explicitly states it is for demonstration purposes and is not maintained. Anyone wanting to use it would need to fork the repository and maintain their own version rather than relying on the original author for updates or bug fixes.

Yoink these prompts

Prompt 1
Add ngx-loading-bar to my Angular app: install the package, place the loading bar component at the top of my layout, and wire it to start when a data fetch begins and complete when the fetch finishes.
Prompt 2
Customize the ngx-loading-bar in my Angular project so the bar color matches my brand color blue, the height is 3 pixels, and the animation speed feels snappy.
Prompt 3
Create an Angular service that uses the loading bar service to show progress during multiple sequential HTTP requests, starting the bar before the first request and completing it after the last one resolves.
Prompt 4
Fork the ng2-loading-bar repository and update it to work with the latest version of Angular, since the original project is unmaintained.

Frequently asked questions

wtf is ngx-loading-bar?

An Angular component that shows a slim animated progress bar at the top of a webpage while content is loading, giving users visual feedback during slow page loads.

What language is ngx-loading-bar written in?

Mainly TypeScript. The stack also includes Angular, TypeScript.

Is ngx-loading-bar actively maintained?

Dormant — no commits in 2+ years (last push 2017-04-03).

What license does ngx-loading-bar use?

No license information is provided in the repository.

How hard is ngx-loading-bar to set up?

Setup difficulty is rated easy, with roughly 5min to a first successful run.

Who is ngx-loading-bar for?

Mainly developer.

View the repo → Decode another repo

This repo across BitVibe Labs

Don't trust strangers blindly. Verify against the repo.