dewball345/breact

Breact: A python library for single page web apps

Hi there, i'm dewball345 and i kind of need to work on my documentation; it's not that bad but I have to work on it.

Anyway, feel free to check out my repos. Make sure to check out the later ones, as some of the earlier ones are kind of empty

breact's Issues

"Dom-diffing" in setState instead of just deleting and re-injecting content.

This was brought to me by @iansparks.

He mentioned that the setState() function may work okay for smaller components, but for bigger, nested ones, it may be inefficient to just delete everything and rerender them.

He suggested the idea of dom-diffing, which is comparing the existing dom with new changes. So instead of replacing everything, only the necessary parts are updated.

If anyone is willing to contribute to this please send a pull request, and I myself will try to get this problem fixed.

Also, you can view the discussion at: https://groups.google.com/g/brython/c/-d7vGkmXWL0/m/EWDSSKt3AgAJ

setState

Hi. In your setState you do this:

    def setState(self, attrs, one_state_change=False):
        for attr in attrs.keys():
            self.state[attr] = attrs[attr]

Did you compare the performance of using dict.update() ?

    def setState(self, attrs, one_state_change=False):
        self.state.update(attrs) 

is group() necessary?

Hi, interesting work.

I have a question about group(). Do you really need it? In one example you use:

 group(DIV(Class="row"), [
                    group(DIV(Class="col-sm form-group"), [
                        LABEL("Enter Title", to="inputt", Class="form-label"),
                        #This beautiful syntax is part of python. the :=(beaver) operator returns an object and stores it to a variable, which we can modify
                        title := INPUT(id="inputt", type="text", Class="form-control"),
                    ]),
                    description := group(DIV(Class="col-sm form-group"), [
                        LABEL("Enter Description", to="inputts", Class="form-label"),
                        TEXTAREA(id="inputts", type="text", Class="form-control")
                    ]),
                ])

but brython does allow you to build this same structure using lists of nested elements:

DIV([
                  DIV([
                        LABEL("Enter Title", to="inputt", Class="form-label"),
                        #This beautiful syntax is part of python. the :=(walrus) operator returns an object and stores it to a variable, which we can modify
                        title := INPUT(id="inputt", type="text", Class="form-control"),
                    ]),
                    description := DIV([
                        LABEL("Enter Description", to="inputts", Class="form-label"),
                        TEXTAREA(id="inputts", type="text", Class="form-control")
                    ], Class="col-sm form-group"),
                ], Class="row")