Mizoine: Step 5. Move to Single-Page Application

After over one year use and collecting pretty big document base (over 1G) I can measure/profile running application.

Even a page without images takes over 1.5MB for each round-trip

Each server round-trip takes more than 1.5 MB traffic. All the scripts and other static resources are being downloaded over and over again. Browser cache doesn’t really work because of secure connection limitations. HTTPS requests are not being cached on client side. Probably because of custom SSL certificate.

Anyway, I have decided to give a try to Vue.js and dramatically refactor whole application front end.

Long story short: I have successfully managed it. Performance has been definitely increased. Back end API improved, better structured and even simplified at important points.

Here are the problems to solve when switching from classic web to SPA (single-page application):

  • An SPA framework required for front-end. UI programming is more complicated
  • UI components are being defined on front end side as well. Complex javascript file structure is required
  • Server should be organised to deliver 3 types of resources:
    • Static resources (images, styles, scripts)
    • Dynamic API (for communication over AJAX/REST requests)
    • Page addresses (specially configured for SPA) – which are visible URLs in browser

Mizoine: How I create Java application. Step 2. Setup.

Development setup

  1. Create new empty project in Bitbucket repository. Name: mizoine
  2. Create new Jira story “Mizoine – Issue tracking”
  3. IDE: Eclipse Oxygen
    1. Mylyn: Select task – Jira “Mizoine – Issue tracking”
    2. Project: Maven based
    3. Create new Maven project. Name: mizoine. Package: com.gratchev. Version: 0.0.1-SNAPSHOT
    4. Check Maven generated all appropriate folders, etc.
    5. Bind project with git repository from Bitbucket

Tools used so far

  • Eclipse
  • Bitbucket
  • Jira

Continue reading

Mizoine: How I create Java application. Step 1. Identity.

Idea

Create an issue tracking system inspired by Jira™.
Actually, same as Jira™, but with improvements:

  1. Completely based on file system:
    • Simple and transparent back-ups, cloning, and everything what file system is good for
    • Easy to setup, repair or monitor with existing tools
    • Version tracking using git™
  2. Use only open and well-community-supported frameworks for everything
  3. Add features, missing in Jira
    • Rename attachments
    • Meta for attachments (description, dates)
    • Move comments between issues
    • Edit comments meta (creation date, etc.)
    • Move attachments between issues
    • Search by file name and description
    • Improved previews and thumbnails for attachments (for example PDF thumbnails)
    • etc.
  4. ???
  5. PROFIT!

Step 1: Project identity

Name

Use existing open tools for name generation. Do not invent a name.
Species name generator → Mizoine

Use existing open tools for icon generation.
Identicon generator: generate your identicon avatar