diff --git a/taichi/backends/vulkan/vulkan_device.cpp b/taichi/backends/vulkan/vulkan_device.cpp
index 494e347103aff..f99e7b568e242 100644
--- a/taichi/backends/vulkan/vulkan_device.cpp
+++ b/taichi/backends/vulkan/vulkan_device.cpp
@@ -1919,6 +1919,7 @@ VkPresentModeKHR choose_swap_present_mode(
 
 VulkanSurface::VulkanSurface(VulkanDevice *device, const SurfaceConfig &config)
     : config_(config), device_(device) {
+#if !defined(TI_EMSCRIPTENED)
 #ifdef ANDROID
   window_ = (ANativeWindow *)config.window_handle;
 #else
@@ -1964,6 +1965,7 @@ VulkanSurface::VulkanSurface(VulkanDevice *device, const SurfaceConfig &config)
     swapchain_images_.push_back(device->create_image(params));
     swapchain_images_.push_back(device->create_image(params));
   }
+#endif
 }
 
 void VulkanSurface::create_swap_chain() {
@@ -2019,7 +2021,7 @@ void VulkanSurface::create_swap_chain() {
 #ifdef ANDROID
   width = ANativeWindow_getWidth(window_);
   height = ANativeWindow_getWidth(window_);
-#else
+#elif !defined(TI_EMSCRIPTENED)
   glfwGetFramebufferSize(window_, &width, &height);
 #endif
 
@@ -2129,7 +2131,7 @@ std::pair<uint32_t, uint32_t> VulkanSurface::get_size() {
 #ifdef ANDROID
   width = ANativeWindow_getWidth(window_);
   height = ANativeWindow_getWidth(window_);
-#else
+#elif !defined(TI_EMSCRIPTENED)
   glfwGetFramebufferSize(window_, &width, &height);
 #endif
   return std::make_pair(width, height);
diff --git a/taichi/backends/vulkan/vulkan_device.h b/taichi/backends/vulkan/vulkan_device.h
index 3ee56d3bc9444..944d75e6e01ab 100644
--- a/taichi/backends/vulkan/vulkan_device.h
+++ b/taichi/backends/vulkan/vulkan_device.h
@@ -6,7 +6,7 @@
 
 #ifdef ANDROID
 #include <android/native_window_jni.h>
-#else
+#elif !defined(TI_EMSCRIPTENED)
 #include <GLFW/glfw3.h>
 #endif
 
@@ -387,7 +387,7 @@ class VulkanSurface : public Surface {
   VkSemaphore image_available_;
 #ifdef ANDROID
   ANativeWindow *window_;
-#else
+#elif !defined(TI_EMSCRIPTENED)
   GLFWwindow *window_;
 #endif
   BufferFormat image_format_;
diff --git a/taichi/backends/vulkan/vulkan_loader.cpp b/taichi/backends/vulkan/vulkan_loader.cpp
index 80e63c2262833..90059f27e4bae 100644
--- a/taichi/backends/vulkan/vulkan_loader.cpp
+++ b/taichi/backends/vulkan/vulkan_loader.cpp
@@ -17,7 +17,7 @@ bool VulkanLoader::init() {
     if (initialized) {
       return;
     }
-#ifdef __APPLE__
+#if defined(__APPLE__) || defined(TI_EMSCRIPTENED)
     initialized = true;
 #else
     VkResult result = volkInitialize();
@@ -29,14 +29,14 @@ bool VulkanLoader::init() {
 
 void VulkanLoader::load_instance(VkInstance instance) {
   vulkan_instance_ = instance;
-#ifdef __APPLE__
+#if defined(__APPLE__) || defined(TI_EMSCRIPTENED)
 #else
   volkLoadInstance(instance);
 #endif
 }
 void VulkanLoader::load_device(VkDevice device) {
   vulkan_device_ = device;
-#ifdef __APPLE__
+#if defined(__APPLE__) || defined(TI_EMSCRIPTENED)
 #else
   volkLoadDevice(device);
 #endif
diff --git a/taichi/backends/vulkan/vulkan_program.cpp b/taichi/backends/vulkan/vulkan_program.cpp
index b40e2422cd26a..b197129495eb8 100644
--- a/taichi/backends/vulkan/vulkan_program.cpp
+++ b/taichi/backends/vulkan/vulkan_program.cpp
@@ -1,8 +1,7 @@
 #include "taichi/backends/vulkan/vulkan_program.h"
 #include "taichi/backends/vulkan/aot_module_builder_impl.h"
 
-#ifdef ANDROID
-#else
+#if !defined(ANDROID) && !defined(TI_EMSCRIPTENED)
 #include "GLFW/glfw3.h"
 #endif
 
@@ -22,16 +21,17 @@ std::vector<std::string> get_required_instance_extensions() {
 
   return extensions;
 #else
+  std::vector<std::string> extensions;
+
+#ifndef TI_EMSCRIPTENED
   uint32_t glfw_ext_count = 0;
   const char **glfw_extensions;
   glfw_extensions = glfwGetRequiredInstanceExtensions(&glfw_ext_count);
 
-  std::vector<std::string> extensions;
-
   for (int i = 0; i < glfw_ext_count; ++i) {
     extensions.push_back(glfw_extensions[i]);
   }
-
+#endif
   // VulkanDeviceCreator will check that these are supported
   extensions.push_back(VK_KHR_GET_PHYSICAL_DEVICE_PROPERTIES_2_EXTENSION_NAME);
 #if TI_WITH_CUDA
@@ -85,6 +85,7 @@ void VulkanProgramImpl::materialize_runtime(MemoryPool *memory_pool,
   *result_buffer_ptr = (uint64 *)memory_pool->allocate(
       sizeof(uint64) * taichi_result_buffer_entries, 8);
 
+#ifndef TI_EMSCRIPTENED
 // Android is meant to be embedded in other application only so the creation of
 // the device and other states is left to the caller/host.
 // The following code is only used when Taichi is running on its own.
@@ -105,11 +106,12 @@ void VulkanProgramImpl::materialize_runtime(MemoryPool *memory_pool,
       TI_WARN("GLFW reports no Vulkan support");
     }
   }
+#endif
 #endif
 
   VulkanDeviceCreator::Params evd_params;
   evd_params.api_version = VulkanEnvSettings::kApiVersion();
-#ifndef ANDROID
+#if !defined(ANDROID) && !defined(TI_EMSCRIPTENED)
   if (glfw_window) {
     // then we should be able to create a device with graphics abilities
     evd_params.additional_instance_extensions =
diff --git a/taichi/gui/gui.h b/taichi/gui/gui.h
index 9b051e93ec6e3..c4d599e6da8e8 100644
--- a/taichi/gui/gui.h
+++ b/taichi/gui/gui.h
@@ -13,7 +13,7 @@
     (defined(TI_PLATFORM_UNIX) && !defined(TI_PLATFORM_OSX))
 #if defined(TI_PLATFORM_ANDROID)
 #define TI_GUI_ANDROID
-#else
+#elif !defined(TI_EMSCRIPTENED)
 #define TI_GUI_X11
 #endif
 #endif
@@ -448,6 +448,17 @@ using GUIBase = GUIBaseAndroid;
 
 #endif
 
+#if defined(TI_EMSCRIPTENED)
+
+class GUIBaseJavascript {
+ public:
+  // @TODO
+};
+
+using GUIBase = GUIBaseJavascript;
+
+#endif
+
 #if defined(TI_GUI_X11)
 
 class CXImage;