Git Product home page Git Product logo

topicdeck's Introduction

Web GDE Deck 💯

Inspired by River of news, but HTTPs only and a PWA.

Attempt to create a PWA that is a news reader that renders on the server and on the client using all the same templating and logic.

Progress

  • Client logic in SW is now shared with the Server logic [done]
  • Templating is done via streaming templates [done]
  • Use WhatWG streams in node. [done]
  • Need to clean up a lot. [errrr.....]
  • Configuration file should really be an OPML file. [todo]
  • Cache fetched data on the client and server [done]
  • To render the client it still needs JS turned on. Investigate server load of RSS feeds. [partially done]
    • This is done in the SW, will use on Server soon.

Thoughts

If possible the server logic and the client logic should be near exactly the same.

Ideally configured via a OPML file that defines the columns, that links to other OPML files that contain the feeds that should be aggregrated in this.

Thoughts:

  • The UI should render the structure without JS. Ideally after this has been rendered, I can stream in the first batch of aggreagated and merged feeds.
  • The UI should then take over and update the feeds in the client as much as possible.
  • On reload, the server should not be hit at all, save for any updates to the OPML file. In an ideal world, the SW would be doing the work.

Technical hitches: We are going to have to proxy the RSS feed requests.

topicdeck's People

Contributors

alcfeoh avatar auchenberg avatar avgp avatar belcherj avatar cironunes avatar csswizardry avatar danwahlin avatar deanhume avatar felipenmoura avatar filipbech avatar gokulkrishh avatar granze avatar j9t avatar jadjoubran avatar jayphelps avatar jefbinomed avatar jorgeucano avatar juristr avatar jvandemo avatar kenchris avatar loiane avatar mgechev avatar mhartington avatar mplacona avatar omranic avatar paulkinlan avatar philnash avatar pselle avatar splaktar avatar webmaxru avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar

topicdeck's Issues

Update the styling

The recent updates are nice, but I still feel that something is missing.

  • Update the description so the text is bigger. 16px font
  • 100% height of the flex container
  • Make the description blockquoted... indent and add a border left

Make it so that the templates can be customized by an integrator

Anyone who uses the module should be able to easily provide their own templates.

  • Add the ability to have custom CSS
  • Add the ability add extra images
  • Add the ability to change the templates.
    • We should just basically have a folder for the assets and if the file exists use that, else use the base...
  • Service Worker needs to know about all the new assets and updates, right now it's a static build.

Add in multitencency

There is quite a lot to think about

  • Add in a custom server route
  • Add in a central location of config files and work out how to serve them
  • Add in a way to debug when on localhost
  • Ensure aliasing works correctly.
  • The all feed needs to be fixed up properly

Inline the CSS

Need to keep it contained in the current file though.

The Lightouse performance score is too low.

  • DOM is too big. 6,224 nodes, aim to be less than 1500.
  • Meaningful first paint is at 1s, but Consistently interactive is 8s. Have a think...
  • Perceptual Speed Index is too high.
  • Suggests to minify JS, however there is an issue somewhere.

Make this repository infrastructure

  • Make a postinstall build step, if this is deployed anywhere every thing needs to be built so it can run
  • Work out a way to start the server - it might have to be a custom index file
  • Refactor configuration so that it can be specified outside of the package

Do a full server render if the data is there...

Specifically 'all' should be ok and the main deck too.

this will work because we don't actually cache the HTML resposen, we have all the templates and the data so we stitch those together in the SW.

The feeds only ever update on 2nd refresh

It looks like the proxy SW logic is trying to be too clever. Given that the SW can read from the cache, we should only ever return /proxy web requests from the network as the resilience is already in the SW...

feat(optimize the proxy)

The proxy will race on the cache or the network to try and be as fast as possible, This presents some issues where data might be stale.

Move to a network first approach, always return from the network unless there is an error or a timeout,

Mobile browser tries to download the page

Hello. I heard about this project while reading Paul's blog and when I visit https://webgdedeck.com on my Android phone, the browser (Chrome, Opera, Firefox Focus) triggers a download instead of opening the page. I haven't checked if this error happens in the desktop yet.

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.