If you have to use components twice just only for 2 different viewports then your design is wrong.
Anyways, you should not check the device from the backend due to caching, it will create other issues.
There can be a solution -
Add a data attribute(data-js-init="false") in your component DOM. when js initialize/act on your component then change the value to true. write a condition on js it only acts on the component if js value is false.