Coder Social home page Coder Social logo

nogahighland / confluence-pagetree-search Goto Github PK

View Code? Open in Web Editor NEW
9.0 9.0 4.0 2.91 MB

A chrome extension to add confluence page tree search feature

License: MIT License

Vue 18.19% Makefile 0.78% TypeScript 81.04%
chrome chrome-extension confluence

confluence-pagetree-search's People

Contributors

darquro avatar dependabot-preview[bot] avatar dependabot[bot] avatar kisshy0601 avatar lastgleam avatar mergery[bot] avatar nogahighland avatar sangjin-oh avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar

confluence-pagetree-search's Issues

Inflate chrome stored tree data

With over 20,000 page, the tree data exceeds chrome storage's max quota 5MB.
Using zlib, the tree data can be much smaller.

Confluence version required

It needs to describe Confluence version in a release note and README to ensure its working.
I've checked R-Confluence version is 6.13.8.

Background fetch

Make this ext fetch the latest tree structure every 10mins if the storage data is older than 10 minutes.

  • Tree structure is updated frequently.
  • This ext fetches the latest tree structure when a new tab is opened or the force sync button is clicked.
  • But an existing tab never fetches the latest tree structure automatically when the tab is left opened for a long time.

Slow first load

Summary

This loads all the nodes in tree div at once.
It takes too much time to see meaningful content.

Problems

All elements are loaded in tree div at the same time when user access a page. (Eager Loading)
querySelector() and querySelectorAll() are used a lot.

Try to

Refactor to use lazy loading.
Refactor to use getElementsByClassName() and getElementsByTagName().

Separate data & view for faster rendering

Problem

Slow loading and filtering over thousands of page data due to individual v-show for each node,
which interferes whole interaction on the page.

Solution

Render only matched nodes.

  • Data is held in array with instance variable which keeps its address (vertical & horizontal position) and its visibility.
  • Filter is applied to the array and matched nodes are structured as a tree and passed to root components.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.