Unable to load the saved model in the browser using Tensorflowjs

Question

I am trying to build a rice classifier using transfer learning on edge device, I took the help of tutorial at https://github.com/ADLsourceCode/TensorflowJS

My sample data is at https://www.dropbox.com/s/esirpr6q1lsdsms/ricetransfer1.zip?dl=0

I saved the model locally using the code mentioned below for rice classification and kept in folder TensorflowJS/Mobilenet_VGG16_Keras_To_TensorflowJS/static/ alongwith vgg and mobilenet but the, I am not able to load the rice model on tensorflowjs in the browser.

If I trying the save the vgg model in my local system and load the model in the tensoflowjs(in browser) it's working well.

# Base variables
import os
base_dir = 'ricetransfer1/'
train_dir = os.path.join(base_dir, 'train')
validation_dir = os.path.join(base_dir, 'validation')
test_dir = os.path.join(base_dir, 'test')
train_cats_dir = os.path.join(train_dir, 'KN')
train_dogs_dir = os.path.join(train_dir, 'DM')

train_size, validation_size, test_size = 90, 28, 26
#train_size, validation_size, test_size = 20, 23, 14

img_width, img_height = 224, 224  # Default input size for VGG16

# Instantiate convolutional base
from keras.applications import VGG16
import tensorflowjs as tfjs
import tensorflow as tf
tf.compat.v1.disable_eager_execution()

img_width, img_height = 224, 224  # Default input size for VGG16

conv_base = VGG16(weights='imagenet', 
              include_top=False,
              input_shape=(img_width, img_height, 3))  
# 3 = number of channels in RGB pictures

 #saving the vgg model to run it locally
 tfjs.converters.save_keras_model(conv_base, '/TensorflowJS/Mobilenet_VGG16_Keras_To_TensorflowJS/static/vgg')

# Check architecture
conv_base.summary()


# Extract features
import os, shutil
from keras.preprocessing.image import ImageDataGenerator
import numpy as np
train_size, validation_size, test_size = 90, 28, 25

datagen = ImageDataGenerator(rescale=1./255)
batch_size = 1
#train_dir = "ricetransfer1/train"
#validation_dir = "ricetransfer1/validation"
#test_dir="ricetransfer1/test"
#indices = np.random.choice(range(len(X_train)))

def extract_features(directory, sample_count):
#sample_count= X_train.ravel()

features = np.zeros(shape=(sample_count, 7, 7, 512))  # Must be equal to the output of the convolutional base
labels = np.zeros(shape=(sample_count))
# Preprocess data
generator = datagen.flow_from_directory(directory,
                                        target_size=(img_width,img_height),
                                        batch_size = batch_size,
                                        class_mode='binary')
# Pass data through convolutional base
i = 0
for inputs_batch, labels_batch in generator:
    features_batch = conv_base.predict(inputs_batch)
    features[i * batch_size: (i + 1) * batch_size] = features_batch
    labels[i * batch_size: (i + 1) * batch_size] = labels_batch
    i += 1
    if i * batch_size >= sample_count:
        break
return features, labels

train_features, train_labels = extract_features(train_dir, train_size)  # Agree with our small dataset size
validation_features, validation_labels = extract_features(validation_dir, validation_size)
 test_features, test_labels = extract_features(test_dir, test_size)



# Define model
from keras import models
from keras import layers
from keras import optimizers

epochs = 2

ricemodel = models.Sequential()
ricemodel.add(layers.Flatten(input_shape=(7,7,512)))
ricemodel.add(layers.Dense(256, activation='relu', input_dim=(7*7*512)))
ricemodel.add(layers.Dropout(0.5))
ricemodel.add(layers.Dense(1, activation='sigmoid'))
ricemodel.summary()

 # Compile model
 ricemodel.compile(optimizer=optimizers.Adam(),
          loss='binary_crossentropy',
          metrics=['acc'])


# Train model
import os
history = ricemodel.fit(train_features, train_labels,
                epochs=epochs,
                batch_size=batch_size, 
                validation_data=(validation_features, validation_labels))


##saving the rice classification model to run it locally
 tfjs.converters.save_keras_model(ricemodel, '/TensorflowJS/Mobilenet_VGG16_Keras_To_TensorflowJS/static/rice/')

I think, there is some mistake in the rice model, how can I solve the issue?

The expected output is to run the rice classification on the browser using tensorflowjs

Answer 1

I think here it might be you are getting an error due to the older version of the tfjs file.

update the latest version to

<script  src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs@0.13.5"></script> 

in your html page but it might arise a new error to due different image size.

I will suggest the open the develope mode in the browser to see the exact error, in this it worked.