Advice on efficiency (export function Vs. onReady)

Ask the community
,
1

Hi,

As per subject, what’s more efficient when having to do with many, say, onClick() or onMouseOut() events?

Thanks.

2

Favourite —> onReady!

$w('#switch1, #switch2, #switch3').onChange((event)=>{
        let selection = event.target.id
        console.log(selection)
        if ($w('#switch1').checked) {
            $w('#boxCONTROL1').style.backgroundColor = "rgba(100,255,100,0.8)", 
            $w('#TXTcode').show()
        } 
        else {
            $w('#boxCONTROL1').style.backgroundColor = "rgba(155,155,155,0.8)",
            $w('#TXTcode').hide()
        }
        if ($w('#switch2').checked) {
            $w('#boxCONTROL2').style.backgroundColor = "rgba(100,255,100,0.8)",
            $w('#boxLINK').show()
        } 
        else {
            $w('#boxCONTROL2').style.backgroundColor = "rgba(155,155,155,0.8)",
            $w('#boxLINK').hide()
        }
        if ($w('#switch3').checked) {
            $w('#boxCONTROL3').style.backgroundColor = "rgba(100,255,100,0.8)";
        } 
        else {$w('#boxCONTROL3').style.backgroundColor = "rgba(155,155,155,0.8)";}
    })

And here a better example, why onReady is my favourite…

$w.onReady(function () {
    const Menu1 = 'MenuButton1' 
    const Menu2 = 'MenuButton2' 
    const Menu3 = 'MenuButton3'
 
    const MenuGRP1 = '#MenuGroup1'
    const MenuGRP2 = '#MenuGroup2'
    const MenuGRP3 = '#MenuGroup3'
 
    $w('#MenuButton1, #MenuButton2, #MenuButton3').onMouseIn  ((event) => {
        console.log(event.target.id)
        switch(event.target.id) {
            case Menu1 :        console.log("Case-1"), $w(MenuGRP1).show(anim, menuOptions);        break;
            case Menu2 :        console.log("Case-2"), $w(MenuGRP2).show(anim, menuOptions);        break;
            case Menu3 :        console.log("Case-3"), $w(MenuGRP3).show(anim, menuOptions);        break;
        }
    })

And also no EXTERNAL connections to the user-interface needed.
NO EXPORT FUNCTIONS, which can lose their connections!

Both working examples can be seen here…
https://www.media-junkie.com/switch-safe-function

…and here …
https://www.media-junkie.com/simple-megamenu