Neiki's Time — Live Demo

Quick Start

1 — Add the script and an element

<div data-neiki-time></div>
<script src="neiki-time.js"></script>
<script>NeikiTime.init();</script>

2 — Or via CDN (jsDelivr / self-hosted)

<script src="https://cdn.example.com/[email protected]/neiki-time.js"></script>

3 — Advanced Configuration

NeikiTime.init({
  timezone: 'Europe/Prague',
  locale: 'cs-CZ',
  showDate: true,
  showMs: true,
  showOffset: false,
  syncInterval: 30000,   // re-sync every 30 s
  theme: 'dark',         // 'light' | 'dark' | 'auto' | 'none'
  onSync: function(info) {
    console.log('Synced via', info.api, '| offset', info.offset, 'ms');
  }
});

Data Attributes (per-element)

Attribute	Description
`data-neiki-time`	Marks the element as a clock (required)
`data-neiki-tz="Asia/Tokyo"`	Override timezone for this element
`data-neiki-nodate`	Hide the date
`data-neiki-noms`	Hide milliseconds
`data-neiki-offset`	Show sync offset & RTT

JavaScript API

Method	Description
`NeikiTime.init(options?)`	Initialize & start
`NeikiTime.destroy()`	Stop everything
`NeikiTime.sync()`	Manual re-sync
`NeikiTime.now()`	Precise UTC timestamp (ms)
`NeikiTime.date()`	Precise `Date` object
`NeikiTime.isSynced()`	Is synchronized?
`NeikiTime.getSyncInfo()`	Last sync info

How It Works

┌─────────────────────────────────────────────────────┐
│ 1. Parallel queries to WorldTimeAPI + TimeAPI.io    │
│ 2. Multiple samples — pick the one with lowest RTT  │
│ 3. NTP-like: offset = serverTime − (t0 + rtt/2)     │
│ 4. Anchored to performance.now() — drift-free tick  │
│ 5. requestAnimationFrame() → smooth rendering       │
│ 6. Periodic re-sync (default every 60 s)            │
└─────────────────────────────────────────────────────┘