Super Useful JavaScript Development Tips

Converting Array-like To Arrays

[{"selector":"#anim-fef7806a-60cd-4db6-8fa9-4051394017c8","keyframes":{"opacity":[1,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(.3,0,.55,1)","fill":"both"}] [{"selector":"#anim-9f398983-3048-4698-a1e7-6eb03b532d70","keyframes":{"transform":["scale(3)","scale(1)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(.3,0,.55,1)","fill":"forwards"}] Green Blob

Dynamic Declaration Of Properties On Objects

[{"selector":"#anim-68ee7d5c-408a-4c70-993f-618e7e55a7c5","keyframes":{"opacity":[0,1]},"delay":0,"duration":2000,"easing":"cubic-bezier(.3,0,.55,1)","fill":"both"}] [{"selector":"#anim-bfa01aed-13e3-4a55-af14-8653d7508552","keyframes":{"transform":["scale(0.3333333333333333)","scale(1)"]},"delay":0,"duration":2000,"easing":"cubic-bezier(.3,0,.55,1)","fill":"forwards"}] Green Blob

Shorten

[{"selector":"#anim-73df2f84-37d7-4198-84f0-d9f198b6b3e7","keyframes":[{"offset":0,"transform":"translate3d(0, -1169.84159%, 0)","easing":"cubic-bezier(.5, 0, 1, 1)"},{"offset":0.29,"transform":"translate3d(0, 0%, 0)","easing":"cubic-bezier(0, 0, .5, 1)"},{"offset":0.45,"transform":"translate3d(0, -328.959455108%, 0)","easing":"cubic-bezier(.5, 0, 1, 1)"},{"offset":0.61,"transform":"translate3d(0, 0%, 0)","easing":"cubic-bezier(0, 0, .5, 1)"},{"offset":0.71,"transform":"translate3d(0, -111.83685600400001%, 0)","easing":"cubic-bezier(.5, 0, 1, 1)"},{"offset":0.8,"transform":"translate3d(0, 0%, 0)","easing":"cubic-bezier(0, 0, .5, 1)"},{"offset":0.85,"transform":"translate3d(0, -41.997313081%, 0)","easing":"cubic-bezier(.5, 0, 1, 1)"},{"offset":0.92,"transform":"translate3d(0, 0%, 0)","easing":"cubic-bezier(0, 0, .5, 1)"},{"offset":0.96,"transform":"translate3d(0, -18.249528804%, 0)","easing":"cubic-bezier(.5, 0, 1, 1)"},{"offset":1,"transform":"translate3d(0, 0%, 0)","easing":"cubic-bezier(0, 0, .5, 1)"}],"delay":0,"duration":1600,"fill":"both"}] Green Blob

Get Query Parameters

[{"selector":"#anim-dacbda7e-1442-4b41-aede-621a97822e6a","keyframes":{"opacity":[0,1]},"delay":0,"duration":600,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-01fb033e-d519-4478-ba6c-58e5f819bc1a","keyframes":{"transform":["translate3d(-115.56292%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":600,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] Green Blob

Deleting Array Elements

[{"selector":"#anim-07485e58-3989-44da-ac0d-a70db3b8696e","keyframes":{"opacity":[0,1]},"delay":0,"duration":600,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] [{"selector":"#anim-8a06a59d-a8dc-4e4c-ad18-19fe6c436b5b","keyframes":{"transform":["translate3d(123.17881%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":600,"easing":"cubic-bezier(0.2, 0.6, 0.0, 1)","fill":"both"}] Green Blob

Check If The Object Is Empty

[{"selector":"#anim-cb5a2fd3-cf0d-4280-a45e-ef86e551b6b2","keyframes":{"transform":["translate3d(-121.81819%, 0px, 0)","translate3d(0px, 0px, 0)"]},"delay":0,"duration":1000,"easing":"cubic-bezier(.2, 0, .8, 1)","fill":"both"}] [{"selector":"#anim-be7a20a2-f46a-4bc0-ae14-c2d3d3e1daaa","keyframes":{"transform":["rotateZ(-180deg)","rotateZ(0deg)"]},"delay":0,"duration":1000,"easing":"cubic-bezier(.2, 0, .5, 1)","fill":"forwards"}] Green Blob Learn more