<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" style="width:calc(100% - 20px); height:300px; padding:10px; ">
    <path d="M0 0 C191.8 0, 191.8 0, 383.5 0 M383.5 0 C575.3 0, 575.3 80, 767 80" stroke="#00BFC5" fill="none" stroke-width="3">
        <animate attributeName="d" attributeType="XML" to=" M0 40 C127.8 40, 127.8 0, 255.7 0 M255.7 0 C383.5 0, 383.5 40, 511.3 40 M511.3 40 C639.1 40, 639.1 80, 767 80" begin="0s" dur="1s" fill="freeze"></animate>
    </path>
</svg>
 
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" style="width:calc(100% - 20px); height:300px; padding:10px">
    <path d="M0 80 C127.8 80, 127.8 0, 255.7 0 M255.7 0 C383.5 0, 383.5 0, 511.3 0 M511.3 0 C639.1 0, 639.1 66.7, 767 66.7" stroke="#00BFC5" fill="none" stroke-width="3">
        <animate attributeName="d" attributeType="XML" to=" M0 40 C127.8 40, 127.8 0, 255.7 0 M255.7 0 C383.5 0, 383.5 40, 511.3 40 M511.3 40 C639.1 40, 639.1 80, 767 80" begin="0s" dur="1s" fill="freeze"></animate>
    </path>
</svg>

第一个是由3个点变成4个点的曲线动画，会看到卡了一下。
第二个是由4个点变成4个点的曲线动画，很顺畅没问题。

有没有什么办法让3个点变成4个点的曲线动画，也变得很顺畅没问题的方法，谢谢各位啦

补充一下：3个点到4个点只是一个例子，有可能30个点到4个点，10个点到40个点都有可能的，所以要通用方法。