• Stars
    star
    103
  • Rank 333,046 (Top 7 %)
  • Language
    JavaScript
  • Created almost 7 years ago
  • Updated almost 7 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

A method to record users' journeys on your site and play them back.

Peeping DOM

This is an experiment.

Peeping DOM enables you to record your users' journeys through your site and play them back.

  • Playback will replicate the screen size used by your user
  • Will highlight the elements being clicked on, and replicate text being entered
  • Will replay state changes in a React app
  • Select which session to play back (e.g. filter by users that searched and bought a product)
  • Play back at real time speed, or step by interactions (type, click, click, type, click, etc)

The two parts

Record

The markup that you must add to your code in order to record the interactions

  • naming clickable elements.
  • recording state changes for state-playback locally

Playback

  • Open a special page for viewing playbacks and select a session (user journey) from a list
  • Play that session (in an iFrame that matches the users viewport)
  • Plays at normal speed or step forward/backward by interaction

More Repositories

1

know-it-all

If you don't know it all, at least know what you don't know.
JavaScript
710
star
2

react-recollect

State management for React
TypeScript
403
star
3

easy-ease

JavaScript
68
star
4

sight-reader

Practice sight reading for piano
JavaScript
55
star
5

fireball

JavaScript
44
star
6

structures-demo

Demo for https://hackernoon.com/the-100-correct-way-to-structure-a-react-app-or-why-theres-no-such-thing-3ede534ef1ed
JavaScript
42
star
7

malla

A simple way to store and update your website's text.
JavaScript
32
star
8

trump-tweets

Two lies and a truth
JavaScript
20
star
9

news-bubbles

JavaScript
11
star
10

about-github

A repo for messing around with GitHub
9
star
11

scatter-bar

A type of chart for comparing multi-run sets of data
JavaScript
6
star
12

davidg-site

My site
JavaScript
6
star
13

disco-mundus

Learn the world - map-based memory training
TypeScript
3
star
14

readable-web-specs

A Chrome extension to improve the readability of web documentation
CSS
3
star
15

skinny

The Skinny Chrome Extension
JavaScript
3
star
16

utils

A bunch of utilities that I use
JavaScript
3
star
17

isolog

Send node console messages to the client
JavaScript
3
star
18

mpl-for-eda

The companion repository for the course "Interactive Matplotlib for Exploratory Data Analysis"
Python
3
star
19

list-html

Runs npm list and outputs to html
JavaScript
2
star
20

api-actions

Messing about with actions and ReST endpoints
1
star
21

talkonanon

Anonymous chat - a 'userless persistence' experiment
JavaScript
1
star
22

gravity-menu

A menu that slides open when you tile your phone because that's useful. https://gravitymenu.firebaseapp.com/
JavaScript
1
star