I was able to produce what I want using Adobe Animate. I want to reduce the amount of code, as Animate inserts extra code that from my perspective seems useless ?

I looked at the HTML and maybe some comments can be tossed. Why send that to the client?

As to the javascript I see a passage where a programmer could roll up what looks like a near repeating line of code inside a for loop but there are tomes about flattening a loop or rolling code up into a loop. I feel that once my code works, I may clean it lightly then close that chapter.

In other words, the code can be reduced as it appears somewhat I mess ?

I'd avoid a mess (?) and just toss the comments or make the comment a single line so that isn't sent.

As to the repeating calls with apparent parameter changes, I guess we could roll those into a for loop but as I noted, there are debates about rolling or unrolling loops.

How about the other parts of the code, is it relevent; or can it be reduced ?

I gave this a medium depth reading to see what easily could be reduced. Line count reduction in both HTML and JS was noted above. Any more and you would have to possibly start from scratch. But my bet is it would be not any faster or smaller.

In particular what line count(s) in the JS / HTML ?

Both. In the html (I'm repeating myself here) the comments can go as not needed for this and rolling up the what looks like repeat code with parameter changes in the Javascript. This would reduce line count and the number of bytes going to the client and in short, optimizing what is there.

I thought the code could be reduced more due to the functions within the code. From what you mention I can only reduce some lines of code and put other parts in a loop.

You probably don't need this webfont stuff. I've deleted thiose lines and it keeps on swinging :)

lib.webFontTxtInst = {}; 
var loadedTypekitCount = 0;
var loadedGoogleCount = 0;
var gFontsUpdateCacheList = [];
var tFontsUpdateCacheList = [];
lib.ssMetadata = [];

lib.updateListCache = function (cacheList) {        
    for(var i = 0; i < cacheList.length; i++) {     
        if(cacheList[i].cacheCanvas)        
            cacheList[i].updateCache();     
    }       
};      

lib.addElementsToCache = function (textInst, cacheList) {       
    var cur = textInst;     
    while(cur != exportRoot) {      
        if(cacheList.indexOf(cur) != -1)        
            break;      
        cur = cur.parent;       
    }       
    if(cur != exportRoot) {     
        var cur2 = textInst;        
        var index = cacheList.indexOf(cur);     
        while(cur2 != cur) {        
            cacheList.splice(index, 0, cur2);       
            cur2 = cur2.parent;     
            index++;        
        }       
    }       
    else {      
        cur = textInst;     
        while(cur != exportRoot) {      
            cacheList.push(cur);        
            cur = cur.parent;       
        }       
    }       
};      

lib.gfontAvailable = function(family, totalGoogleCount) {       
    lib.properties.webfonts[family] = true;     
    var txtInst = lib.webFontTxtInst && lib.webFontTxtInst[family] || [];       
    for(var f = 0; f < txtInst.length; ++f)     
        lib.addElementsToCache(txtInst[f], gFontsUpdateCacheList);      

    loadedGoogleCount++;        
    if(loadedGoogleCount == totalGoogleCount) {     
        lib.updateListCache(gFontsUpdateCacheList);     
    }       
};      

lib.tfontAvailable = function(family, totalTypekitCount) {      
    lib.properties.webfonts[family] = true;     
    var txtInst = lib.webFontTxtInst && lib.webFontTxtInst[family] || [];       
    for(var f = 0; f < txtInst.length; ++f)     
        lib.addElementsToCache(txtInst[f], tFontsUpdateCacheList);      

    loadedTypekitCount++;       
    if(loadedTypekitCount == totalTypekitCount) {       
        lib.updateListCache(tFontsUpdateCacheList);     
    }       
};
// symbols:

I assume that is the Js code, and I should remove the comments from the HTML. Besides that leave the rest of the HTML alone ?

I was looking at the former code, and for example, some parts you kept in the code wondering what is the 'cur' variable for example, as I can't find it in the HTML or the Js ? Maybe you know how Adobe Animator writes out it's Javascript ? :)

Sorry, but I don't know anything about Adobe Animator.

The code adjustments you posted, don't work; as Js ?

The code adjustments you posted, don't work; as Js ?

Not sure what you mean with this, but I didn't make any adjustments. I just deleted those webfont functions from the js in that codepen and it kept on swinging, so I assumed those are not needed.

Do you know if code pen has incremental saving ? I updated with your code and I don't see any swinging ?

Wow :) The js that I posted here in the thread was some js that I REMOVED from the js in that first codepen of yours. You wanted to reduce the js, so that's what i did. I didn't make any adjustments, I just removed those lines to see if the bloody thing kept on swinging :). And it did!

I'm wondering why I'm no longer seeing anything swing ?

I'm wondering why I'm no longer seeing anything swing ?

Because in the second pen you left everything out in the js that made it swing. All the shape drawing and animating stuff. What you kept in there was the part that was actually not needed and could be left out :)

Because in the second pen you left everything out in the js that made it swing. All the shape drawing and animating stuff. What you kept in there was the part that was actually not needed and could be left out :)

You deleted a few lines from the code to which all I did was overwrite that code and instantly my swinging is gone, doens't make sense even though you say I deleted what I should have kept and didn't keep what I should've kept.

Are you aware if CodePen has incremental save so I can rever to a previous saved pen of the same session ?

Are you aware if CodePen has incremental save so I can rever to a previous saved pen of the same session ?

I've googled a bit for you, but it seems you're out of luck. You should've forked your first pen.

I was able to get it retrieved as I had the code stored in a folder :)

I don't see the webfont code in the code ? Second can't the armature1 code be placed in a loop ?

I don't see the webfont code in the code ?

Indeed! Because it's not in this pen (anymore). I guess you took it out already.

Second can't the armature1 code be placed in a loop ?

I don't know either :) Perhaps someone else.