rbutrcom / rbutr-browser-extension

rbutr tells you when the webpage you are viewing has been disputed, rebutted or contradicted elsewhere on the internet.
http://rbutr.com/
GNU General Public License v3.0
6 stars 0 forks source link

Use vuejs #24

Open gagarine opened 7 years ago

gagarine commented 7 years ago

Now "template" are basically HTML that we transform with direct DOM manipulation.

Using http://vuejs.org will allow for much cleaner template and data binding. Using https://github.com/vuejs/vue-router will let us write proper route.

shanness commented 7 years ago

Looks good! I wonder if it would be possible to grab the templates from the server and store them in local storage or something, so we could modify them without having to update the plugin? Does that sound like a good idea to you two?

gagarine commented 7 years ago

I think it's better to regularly upload a new version. It can be a bit hard because of the review process until the extension is stable. But code review by the Mozilla team is a nice to have :).

If update become a problem, I will love to be able to dynamically upgrade the extension. But running scripts from external sources may cause your extension to be unpublished or blocked. Source: http://stackoverflow.com/questions/28020878/chrome-extension-load-and-execute-external-script/36645710#36645710

So really I think we should definitely forget about loading external dynamic contents (templates or scripts).

EDIT: as a user, I will hate if scripts was dynamically loaded and executed on my browser...

shanness commented 7 years ago

Yep, cool, np, although I was thinking the templates aren't really scripts, but I suppose they are. We are using codepush (for mobile apps) at my other startup, and it's been great, but yeah, let's just stick to static files for now. https://microsoft.github.io/code-push/

tomlutzenberger commented 7 years ago

Never used Vue.js yet. What are the benefits instead of doing it by ourselfs?

gagarine commented 7 years ago

Like most JS framework (react, angular, ...) the idea is to bind and js object state with a template than is then rendered in HTML. Vuejs is simpler than the others, also you don't have to learn somethings news like JSX. On top of the template/data binding you have routing. You end up with somethings similar than a MVC pattern (load a route -> get data from server / browser -> populate your object -> call a view).

Doing this by yourself is complicated. Specially because vuejs use a "virtual dom" for performance reason. I think you mean using direct dom manipulation, but this is quickly ugly because you mixing template manipulation (view) in the "controller" instead of just sending data to your views.

For example, right now I don't even know all the views we have. If we use vuejs they will be all listed in the router.

I don't have a lot of experience with vuejs (it's quiet new), I used mostly angular in the past. But I can try it on a new branch to see if it would be easy to implement and if it fit the project.

shanness commented 7 years ago

I think it's worth a quick bit of prototyping on a new branch to see if this is easy. Using a simple client side MVC framework seems like a good idea to me.